javascript - 如何用跨度包裹选定的单词

Question

我希望能够将鼠标悬停在网页上的任何单词上，并在该单词上方显示一个包含该单词的弹出窗口。如果没有巨大的性能问题，这似乎几乎是不可能的，所以我尝试双击而不是悬停。

通过双击，我可以检测到单词的文本，但我无法在页面中对单词本身执行任何操作。基本上，我想用 span 标签包裹选定的文本，以便我可以相对于它定位内容。我以前见过用荧光笔完成的，但我不知道怎么做。

注意:这只需要在 Firefox 中工作。

Answer 1

您可以使用这些功能:

var range = window.getSelection().getRangeAt(0);
var newNode = document.createElement("b");
range.surroundContents(newNode);

这会用 b 标签包围您的选择。