javascript - 将 iframe 滚动到选定的文本

Question

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

Answer 1

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

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

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

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