Javascript 根据文本选择确定节点名称

我有一个用例，用户可以选择p元素中的一些文本，我需要切换“粗体”它-即，如果它不粗体，则将文本粗体，反之亦然。是否有方法根据所选文本确定节点类型/名称

例如：在下面的示例中，当用户选择“Foo”时，我想知道已选择了一个跨度。如果用户选择“条”；我想知道选择了p。如果用户选择“foob”；我想知道选择了p

$'toggle-bold'。单击函数{ //以下内容将始终添加一个新跨距，该跨距将环绕选定的文本，然后将其加粗 var selection=window.getSelection.getRangeAt0； //是否仍要确定选定文本的节点类型/名称？ var selectedText=selection.extractedcontents； var span=document.createElementspan； span.appendChildselectedText； selection.insertNodespan； $span.css'font-weight'，'bold'； };

富吧

切换粗体此对象有两个属性：范围开始的节点和范围结束的节点。然后可以通过nodeName属性获取节点名。如果所讨论的节点是文本节点，则可以使用parentNode，也可以不使用parentNode。例如，由于您的选择变量实际上引用的是一个范围，而不是一个：

通常，同样，这些将显示文本，因为范围可能位于文本节点中

$'toggle-bold'。单击函数{ //以下内容将始终添加一个新跨距，该跨距将环绕选定的文本，然后将其加粗 var selection=window.getSelection.getRangeAt0； //是否仍要确定选定文本的节点类型/名称？ console.logStart节点的nodeName:+selection.startContainer.nodeName； console.logEnd节点的nodeName:+selection.endContainer.nodeName； var selectedText=selection.extractedcontents； var span=document.createElementspan； span.appendChildselectedText； selection.insertNodespan； $span.css'font-weight'，'bold'； };

富吧

---

切换粗体对于此特定用例，您可以使用document.execCommandbold替换该事件处理程序中的所有代码；虽然在大多数浏览器中它会插入。。。而不是一个字号为…。@T.J.Crowder的span谢谢，我不知道。最终，我需要更多的控制，所以，我将能够说设置字体重量为600。谢谢，在firefox上，这似乎总是输出文本，即使我选择了span@JakeM：如上所述，如果您想知道父元素的节点名，请使用parentNode访问它，然后读取其节点名。但我怀疑即使在Firefox上，也有可能获得文本节点以外的内容，我知道这是在Chrome上。例如，var name=selection.startContainer.nodeName；如果名称===text{name=selection.startContainer.parentNode.nodeName；}或不是名称，则可以检查类型：var name=selection.startContainer.nodeType==1？selection.startContainer.nodeType:selection.startContainer.parentNode.nodeType；

console.log("Start node's nodeName: " + selection.startContainer.nodeName);
console.log("End node's nodeName: " + selection.endContainer.nodeName);