javascript - 在所选文本之前插入元素

我想在网页上实现这样的功能:调用时，它检查页面上是否有某些文本选择(通常显示为彩色倒排文本)，如果是，则在的第一个单词前插入一个<img src="my.png"/>元素选择。

都欢迎使用纯JavaScript或jQuery代码，最好使用jQuery。谢谢。

最佳答案

我可以向您提出此解决方案:

$('#butt').click(function(){
  var sel = window.getSelection();
  if (sel.toString().length>0) {
     var key = sel.anchorNode.compareDocumentPosition(sel.focusNode) & Node.DOCUMENT_POSITION_PRECEDING
        ? 'focus' : 'anchor';
     var $elem = $(sel[key+'Node']), txt = $elem.text(), offset = sel[key+'Offset'];
     var $f = $(document.createTextNode(txt.slice(0, offset)));
     $elem.replaceWith($f);
     $(document.createTextNode(txt.slice(offset))).insertAfter($f);
     $('<img src=http://dystroy.org/flore/icon.png>').insertAfter($f);
  }
});

Demonstration

关于javascript - 在所选文本之前插入元素，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/17346225/