Javascript 可编辑内容的格式按钮反映选择格式

我们有一个

contenteditable=“true”

div，用作所见即所得文本编辑器。我们添加了一个与使用media.com类似的基本格式工具栏

使用

execCommand（）

，例如，如果用户按下

bold

按钮，我们可以将所选文本设置为粗体。这很有效

但是，如果用户选择了粗体文本的一部分，我们还没有做到的是突出显示

bold

按钮，如上图所示。当然，通过在按钮上传递

is active

类可以很容易地做到这一点，但是我们如何知道所选文本在这种情况下是粗体的呢

我们认为可以使用

选择

API来完成，但是这个用例似乎没有文档化。

因为execCommand（）使用html标记包装器，比如B标记表示粗体。 所以当你选择这个词的时候，我相信你是在用某种js来表示格式化收费站只是在这个函数中添加了更多的代码，就像这样

if(selectedElement.nodeName == "B"){
    toolbarBoldButton.classlist.add("is-active");
}

注意：我使用js函数“nodeName”获取围绕execCommand（）的标记名（在本例中为bold/B），然后匹配它是否匹配标记，如果为true，我将向Toolbar bold样式元素添加is active类

因为execCommand（）使用html标记包装器，比如B标记表示粗体。 所以当你选择这个词的时候，我相信你是在用某种js来表示格式化收费站只是在这个函数中添加了更多的代码，就像这样

if(selectedElement.nodeName == "B"){
    toolbarBoldButton.classlist.add("is-active");
}

---

注意：我使用js函数“nodeName”获取围绕execCommand（）的标记名（在本例中为bold/B），然后匹配它是否匹配标记，如果为true，我将向Toolbar bold样式元素添加is active类

共享小提琴或代码片段共享小提琴或代码片段mate@jivan另外，如果你在任何git回购或任何东西上有代码，请告诉我，如果你愿意，我将进一步帮助你…@jivan如果你在任何git回购或任何东西上有代码，请告诉我，如果你愿意，我将进一步帮助你。。。