1

そのため、ブラウザ（この場合はAndroid WebView）でHTMLテキストをレンダリングしています。レンダリングされた後、テキストの任意の行のピクセル内の（x、y）位置が何であるかを知りたいです 。私が使用している行の実用的な定義は、<p>タグに含まれている、またはタグの前に表示されているすべてのテキストだけではありません<br>。ユーザーに表示される線を意味します。

私は提案された方法を受け入れます。

div内の行数とそれぞれの高さを見つけることができるCSSプロパティはありますか？それは実行可能な解決策を提供するでしょう。

ありがとう！！

4

2 に答える 2

2

回線に個別にアクセスすることはできません。ただし、一部のJavaScriptを使用すると、既知のインデックスを持つ行の位置を見つけることができます。基本的な概要は次のとおりです。

var p = document.getElementById("ptag"); //get the text container that contains your line
var nthline = 3; //the line for which you'd like to find the position
var lnheight = parseInt(window.getComputedStyle(p).lineHeight); //get the height of each line
var linepos = [p.offsetLeft, p.offsetTop + lnheight * (nthline - 1)]; //a [left, top] pair that represents the line's position

注：これは、コンテナーにテキスト以外のものがないことを前提としています。

于 2012-09-21T19:41:31.383 に答える
0

それを行うための標準的な方法はありません。あなたは自分の想像力を参照してハックを発明する必要があります。今、私はこれについて2つのアイデアを考えることができます。

  1. のように各単語をスパンで囲みます。これは、<span class="word">word</span>正規表現や文字列関数で簡単に実行でき、後で<span>その位置を読み取る各単語をループし、計算を追加すると、行が始まる行数（top位置をインクリメントした単語）を見つけることができます。最後の単語から）および行が終了したとき（行の最後の単語+その単語の幅）。

  2. :first-line次のような疑似要素を使用して、最初の行にスタイルを適用します。

    p：first-line {background-color：white; / *同じ既存の色なので、表示に影響はありません* /}

    後でDOMで、そのスタイルが適用されたテキストを見つけます。このアイデアは、最初のアイデアほど良くはありませんが、他の方法を考えさせることができるかもしれません。

于 2012-09-21T19:50:43.903 に答える