Javascript中选定文本的nodeName

问题描述

| 我正在制作一个HTML文本编辑器。 为此，我有一个contenteditable设置为true的div。 为了使选定的文本“加粗”，我试图找到选定文本的节点。 我应该怎么做，或者有其他方法可以实现这一点（特别是在ie）。     

解决方法

首先，请注意，用户的选择与DOM中的节点没有直接关系。考虑以下HTML片段：

<p>
    Now <b>is the time</b> for all <u>good men</u>
    to come <i>to the <em>aid</em> of their</i>
    country.
</p>

假设用户的选择范围从“时间”的开始到“国家”的结束。至少涉及12个节点： 文本节点的一部分：\“ time \”

<b>

节点的结束标记。 文本节点：\“ for all \” 一个完整的“ 2”节点，带有一个子节点： 文本节点“好人” 文本节点：“来” 完整的“ 3”节点，带有子节点： 文本节点：“到” 完整的“ 4”节点，带有子节点： 文本节点：“帮助” 文本节点：“ \” 文本节点的一部分：\“ country \”（请注意，完整的文本节点包含一个句点，但是选择不包含。） 因此，您实际上不能要求提供nodeName，因为这里有很多节点。 但是，您可以问\“一个容器的nod​​eName是什么，它完全包围了用户的选择，即使它也可能包含未选择的内容？\” 如果这是您想知道的，则需要TextRange.parentElement（）方法（仅对于IE，其他浏览器将使用range.commonAncestorContainer属性）。 例如，在IE中：

window.document.selection.createRange().parentElement().nodeName;

正如您在问题标题中指出的那样，这将使您获得nodeName。这与您想要在问题文本中指出的文本加粗不同。如果要使文本加粗，则可能需要TextRange.execCommand（）方法。

window.document.selection.createRange().execCommand(\'Bold\',false);

这应该使选择大胆。存在可能的命令列表。     ,这将为您返回nodeName，但是您决定获取选定的文本：

$(\"your-selector-here\").context.nodeName;