Question

我们有一个contenteditable="true" div，我们将其用作所见即所得的文本编辑器。我们添加了一个类似于使用Medium.com的基本格式工具栏

使用execCommand()，例如，如果用户按下bold按钮，我们就能够将所选文本设为粗体。这很有效。

但是，我们尚未设法做的事情是，如果用户选择粗体文本的一部分，则会突出显示bold按钮，如上图所示。这可以通过在按钮上传递is-active课程来轻松完成，但我们如何知道所选文本在这种情况下是粗体 ？

我们认为也许可以使用Selection API来完成，但这个用例似乎没有记录。

Answer 1

因为execCommand（）使用html标签包装器，如B标签用于粗体。因此，当您选择单词时，我确信您正在使用某种js来表明格式化收费栏只需在该函数中添加更多代码。

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

注意：我正在使用js函数“nodeName”获取标记名称，该标记名称包含在execCommand（）中，在这种情况下为bold / B，然后匹配，如果它与标记匹配，如果为true，则添加is-active类到工具栏粗体样式元素。