滚动 iframe 到选定的文本答案

【问题标题】：scroll iframe to selected text滚动 iframe 到选定的文本
【发布时间】：2012-06-25 15:18:02
【问题描述】：

我正在使用 rangy 选择 IFrame 选择中的文本，但有时我需要滚动 IFrame 才能查看此选择。 是否可以自动将 IFrame 滚动到所选文本？

【问题讨论】：

【解决方案1】：

您可以使用包含选择的锚节点的元素的 scrollIntoView() 方法，但这可能会滚动主文档以及 iframe，并且如果选择从几行开始进入文本节点也可能不准确，例如例子。

var sel = rangy.getSelection();
var anchorNode = sel.anchorNode;
if (anchorNode) {
    if (anchorNode.nodeType != 1) {
        anchorNode = anchorNode.parentNode;
    }
    anchorNode.scrollIntoView();
}

更好的选择可能是使用选择范围的边界矩形，在大多数现代浏览器中可通过范围的getBoundingClientRect() 方法获得，并手动滚动 iframe 的文档。但是，这并不是普遍支持的，并且是相对于视口而不是文档而言的。这是一个相关的问题和答案：

https://stackoverflow.com/a/6847328/96100

【讨论】：