Javascript：圍繞用戶選擇獲取html？

Question

這是有可能得到的任何用戶與使用Javascript鼠標選中，就像這樣：http://www.motyar.info/2010/02/get-user-selected-text-with-jquery-and.html

我的問題是，我不只是需要這樣的文字，但我也需要：

1. （例如，如果用戶選擇「hello」，並且這個hello在源代碼中產生爲：「<div><span>hello</span></div>」，那麼它應該返回）。

2. 做同樣的圖形

任何人都可以引導我通過這個過程，還是有選擇，如果無法做到這一點？

Answer 1

這將在所有主流瀏覽器中完成。對於IE和更多符合標準的瀏覽器，有單獨的分支。在IE中，它稍微容易一些，因爲根據選擇創建的專有TextRange對象具有方便的htmlText屬性。在其他瀏覽器中，您必須使用DOM Range的cloneContents()方法創建一個包含所選內容副本的DocumentFragment，並通過將片段附加到元素並返回元素的innerHTML屬性來從中獲取HTML。

function getSelectionHtml() { 
    var html = ""; 
    if (typeof window.getSelection != "undefined") { 
     var sel = window.getSelection(); 
     if (sel.rangeCount) { 
      var container = document.createElement("div"); 
      for (var i = 0, len = sel.rangeCount; i < len; ++i) { 
       container.appendChild(sel.getRangeAt(i).cloneContents()); 
      } 
      html = container.innerHTML; 
     } 
    } else if (typeof document.selection != "undefined") { 
     if (document.selection.type == "Text") { 
      html = document.selection.createRange().htmlText; 
     } 
    } 
    return html; 
} 

alert(getSelectionHtml());