为啥在 JavaScript 中使用 getRangeAt() 会从选择中删除一些内容？

Posted 2023-03-06

【中文标题】为啥在 JavaScript 中使用 getRangeAt() 会从选择中删除一些内容？

【英文标题】：Why using getRangeAt() removes some content from selection, in JavaScript?为什么在 JavaScript 中使用 getRangeAt() 会从选择中删除一些内容？

【发布时间】：2014-11-09 05:26:46

【问题描述】：

使用 Firefox，我可以使用 window.getSelection() 来获取选定的文本。

如果我选择了一张图片，则返回 alt 属性。

但是，如果我使用.getRangeAt(0)，则返回的选择不带alt 属性。

我希望它出现在我的变量中，请问我该如何解决这个问题？

你可以在这里试试：http://jsfiddle.net/Q982A/56/

如果选择整行，会先打印Hello. :)，然后再打印Hello.。

【问题讨论】：

@MartinErnst 它似乎只适用于 Firefox。

@imtheman 借口，我被一个电话分心了。评论已删除。

【参考方案1】：

你想如何使用这个范围？范围是一个对象，其toString 方法是内部文本（请参阅MDN doc - Range.toString），而不是显示的内部 html。

尽管如此，您在此对象中拥有整个选择，您可以通过使用它创建一个片段来将其可视化，例如：

var sel = window.getSelection();
var selRange = sel.getRangeAt(0);
document.getElementById("test").appendChild(selRange.extractContents());

看到这个fiddle。

---

编辑：

您也可以使用这样的文档片段：http://jsfiddle.net/Q982A/66/（为了不使用显示的元素）...