選定文本的HTML

Question

是否有跨瀏覽器的方式來獲取所選文本的HTML？

Answer 1

此功能將做它在所有主要瀏覽器：[在瀏覽器，跨平臺的入門選擇的文本]

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; 
 
} 
 

 

 
// bind events for selection 
 

 
document.addEventListener('mouseup', function(){ 
 
    var selectedHTML = getSelectionHtml(); 
 
    if(selectedHTML) 
 
    console.log(selectedHTML) 
 
}); 
 

 
document.addEventListener('keyup', function(e){ 
 
    var selectedHTML, key = e.keyCode || e.which; 
 
    if(key == 16){ // if "shift" key was released 
 
    selectedHTML = getSelectionHtml(); 
 
    if(selectedHTML) 
 
     console.log(selectedHTML) 
 
    } 
 
});

<ul contenteditable> 
 
    <li><p>Select <b>this</b> <em>text</em> right <i>here</i></p></li> 
 
    <li>Or <b>this text</b></li> 
 
</ul>