如何用一个contenteditable元素中的htmlreplace选定的文本？

有了contenteditable元素，我怎样才能用我自己的htmlreplace选定的内容？

Answer 1

在这里看到工作jsFiddle： http : //jsfiddle.net/dKaJ3/2/

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; } } alert(html); } 

来自Tim Down的代码： 从用户select的文本中返回HTML

Answer 2

要获取选定的HTML，可以使用我为这个问题编写的函数。 要用您自己的HTMLreplaceselect，您可以使用此function 。 以下是replace器函数的一个版本，它插入一个HTMLstring，而不是一个DOM节点：

 function replaceSelectionWithHtml(html) { var range; if (window.getSelection && window.getSelection().getRangeAt) { range = window.getSelection().getRangeAt(0); range.deleteContents(); var div = document.createElement("div"); div.innerHTML = html; var frag = document.createDocumentFragment(), child; while ( (child = div.firstChild) ) { frag.appendChild(child); } range.insertNode(frag); } else if (document.selection && document.selection.createRange) { range = document.selection.createRange(); range.pasteHTML(html); } } replaceSelectionWithHtml("<b>REPLACEMENT HTML</b>");