Question

我的HTML代码与此类似：

<pre>
    words words words
    words <span> words mystery words</span>
    words words words
</pre>

我希望使用Javascript（native或MooTools）获得与 pre 标签相关的“神秘”字符偏移。我可以使用anchorNode属性获取 span 标记，但我无法找到一种方法来获取 pre 标记。

Answer 1

您可以使用DOM Range执行此操作：

function getCharOffsetRelativeTo(container, node, offset) {
    var range = document.createRange();
    range.selectNodeContents(container);
    range.setEnd(node, offset);
    return range.toString().length;
}

示例：

var sel = window.getSelection();
var pre = document.getElementById("your_pre_id");
var offset = getCharOffsetRelativeTo(pre, sel.anchorNode, sel.anchorOffset);

注意事项：

这适用于除IE＆lt; = 8之外的所有主流浏览器。如果您需要IE的解决方案，那么我可以提供它。
此函数会计算<script>或<style>标记内的字符和不可见元素（例如，由CSS display: none隐藏）。

Answer 2

你可以编写一个使用递归解决方案计算它的方法...获取神秘的字符偏移量，然后获取span的父节点并获得span的偏移量到开头...重复直到所需标签被找到（前）或直到你用完标签

在嵌套的html标记内获取字符偏移量

2 个答案: