javascript - HTML 中选定文本的颜色变化

Question

我想突出显示使用 Javascript 更改所选文本颜色的功能。我正在使用以下方法。

function android_selection_highlight(replacrmenthtml){
    try {
        if (window.getSelection) {
            sel = window.getSelection();
            var range = sel.getRangeAt(0);

            var selectionStart = $("<span style=\"color:red\">");
            var startRange = document.createRange();
            startRange.setStart(range.startContainer, range.startOffset);


            var selectionEnd = $("</span>");
            var endRange = document.createRange();
            endRange.setStart(range.endContainer, range.endOffset);

            startRange.insertNode(selectionStart[0]);
            endRange.insertNode(selectionEnd[0]);
        }
    }
    catch (e) {

    }
}

但是当我调用该方法时它给出了 DOM 异常。我认为当我在所选文本前面插入起始 span 标记时，它会破坏 DOM 结构，因为此时没有结束标记。如何解决这个问题？

已编辑:会有一个突出显示按钮。选择文本，如果用户点击突出显示按钮，所选文本的文本颜色将改变。

Answer 1

如果选择您想要更改颜色，请使用此代码。

    ::-moz-selection { color: red;}
    ::selection { color: red; }