在reactjs中获取带有标记的高亮文本

Question

my <span class="highlight">highlighted</span> word

在上面选择的文本包括html标签。当我使用window.getSelection()时，只返回没有标记my highlighted word的文本，但我需要如上所述的带有<span>标记的整个选定文本。有人能帮我吗？

Answer 1

为了获得给定标记的内部HTML，您应该尝试使用innerHTML道具。例如：

对于标签：

<p id="high">My <span class="highlight">Highlighted</span></p>

您可以将节点存储在一个变量中，如：

const text = document.getElementById("high");

如果你访问道具innerHTML，它会返回p标签中的值

console.log(text.innerHTML)

结果："；我的<span class＝"；突出显示">突出显示的"；

Answer 2

可以尝试类似的

window.getSelection().anchorNode.parentNode

Answer 3

我使用得到了解决方案

window.getSelection().getRangeAt (0).cloneContents ()