0

JavaScriptを使用して、HTMLドキュメント全体の要素によって影響を受ける文字の範囲を取得する方法を理解しようとしています。Webkit互換のコードだけが必要です。

私はちょうど正しい用語を検索していないと思っていますか？

これが私が扱うものの例です：

<body>
This is the way we 
<span class="highlight"><img src="image.png" />
search the <span class="heavy">text</span>
</span>, 
search the text, search the text, 
early in the morning!
</body>

クラスハイライトでスパンへの参照を取得した場合...ハイライトスパンに含まれる文字の開始インデックスと終了インデックスを知りたいのですが、もちろん、その子スパンのテキストは含まれていません。 "<"、 ">"などの要素宣言自体の一部であるか、それらの間にあるものです。

4

2 に答える 2

2

簡単なアプローチは、DOM範囲を使用することです。このアプローチは完全ではありません。オフセットには、空白のテキストノード、スクリプト要素内のテキストノード、CSSによって非表示になっている要素内のテキストが含まれ、ブロック要素や要素によって示される改行は含まれませんが<br>、要件には十分な場合があります。 。

デモ： http： //jsfiddle.net/timdown/QhNZ6/

コード：

function getOffsetWithinBodyText(node) {
    var range = document.createRange();
    range.selectNodeContents(document.body);
    range.setEndBefore(node);
    var start = range.toString().length;

    return {
        start: start,
        end: start + node.textContent.length
    };
}
于 2013-01-21T15:30:35.310 に答える
-1

そのテキストを取得したいだけの場合：

document.querySelectorAll(".highlight")[0].innerText
于 2013-01-21T15:36:28.793 に答える