在光标位置后面添加内容

最新推荐文章于 2024-09-12 16:15:37 发布

古月萧

最新推荐文章于 2024-09-12 16:15:37 发布

阅读量417

点赞数

文章标签： node.js html javascript

本文链接：https://blog.youkuaiyun.com/Salunone/article/details/120060757

版权

这个JavaScript函数用于在当前光标位置插入HTML内容。它首先获取选区，然后删除选区内容，接着创建一个div元素，将HTML插入div并转化为文档片段。最后，将文档片段插入到选区，并恢复选区。此函数适用于现代浏览器和IE9及以下版本。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

function pasteHtmlAtCaret(html) {
    var sel, range;
    if (window.getSelection) {
        // IE9 and non-IE
        sel = window.getSelection();
        if (sel.getRangeAt && sel.rangeCount) {
            range = sel.getRangeAt(0);
            range.deleteContents();

            // Range.createContextualFragment() would be useful here but is
            // only relatively recently standardized and is not supported in
            // some browsers (IE9, for one)
            var el = document.createElement("div");
            el.innerHTML = html;
            var frag = document.createDocumentFragment(), node, lastNode;
            while ( (node = el.firstChild) ) {
                lastNode = frag.appendChild(node);
            }
            range.insertNode(frag);

            // Preserve the selection
            if (lastNode) {
                range = range.cloneRange();
                range.setStartAfter(lastNode);
                range.collapse(true);
                sel.removeAllRanges();
                sel.addRange(range);
            }
        }
    } else if (document.selection && document.selection.type != "Control") {
        // IE < 9
        document.selection.createRange().pasteHTML(html);
    }
}