删除选中的文本粗体和前景?没有execCommand

remove selected text bold and foreground? without execCommand

本文关键字：没有 execCommand 文本 删除      更新时间：2023-09-26

我使用javascript来突出显示或加粗选定的文本范围，它的工作很好，但我怎么能使它UNBOLD和unhighlight，如果按钮再次点击，选定的范围是加粗或突出显示

我不能使用文档。Execcommand或jquery，因为我在android webview中使用它，如果我使用doc。execcommand命令像1秒或更多的工作(大文本)，并使用javascript它瞬间，如果我使用Jquery(zepto或其他)，文本需要AGES在webview中打开，没有它，最多需要1或2秒。

= (

我用什么使选定的文本BOLD:

function bold() {
    var range               = window.getSelection().getRangeAt(0);
    var selectionContents   = range.extractContents();
    var span                = document.createElement("span");
    span.appendChild(selectionContents);
    span.setAttribute("class","bold");
    span.style.fontWeight  = "bold";
    range.insertNode(span);
  }

和高亮(PS:高亮不会是特定的颜色，用户将通过颜色选择器进行选择，该选择器将返回#xxxxxx

function foreground() {
var range               = window.getSelection().getRangeAt(0);
var selectionContents   = range.extractContents();
var span                = document.createElement("span");
span.appendChild(selectionContents);
span.setAttribute("class","foreground");
span.style.color            = "#" + colorbyUser;
range.insertNode(span);}

我认为粗体/斜体/strike/strikeThrough/下划线只能是css中的一个特定类，我只是添加它并删除(不知道如何删除它，如果它已经设置为所选范围)

但背景和前景色不能，因为它可以为每个选择(字母/单词或更多)不同

sorry the bad English =x

编辑C-smile

我得到了它，但我不知道如何在这种情况下获得元素:

<span class="bold">Hello   <span class="underline">C</span>-<span class="italic">Smile</span></span>

我怎么能删除粗体的HELLO如果用户选择只是HELLO，但不删除粗体的C-Smile??

这可能吗?没有jquery(加载一个大文档需要很长时间)或doc。执行命令(在大文档中工作需要很长时间)

如果您将范围包装成<span class="highlight">然后，要删除它，您需要展开它—获取跨度的内容节点并用其内容节点替换该跨度。

这正是jQuery中$.unwrap()的作用

相关文章：