javascript - divの非オーバーフローコンテンツの長さを取得する方法

Question

大きなテキストコンテンツを含む div があります。を使用して、ボックス内にのみコンテンツを表示しますoverflow:hidden。

ボックス内のこの目に見えるコンテンツ、つまり非オーバーフローコンテンツの長さ（文字数なし）を取得するにはどうすればよいですか。

Answer 1

で高さを設定した場合はdiv、すでに数値が設定されています。しかし、そうでない場合は、divJS 関数を使用する高さを取得する必要があります。どれだけコンテンツが隠されていても、の高さはdiv見えるものです。

JS の他のすべての作業と同様に、すべてのブラウザーで簡単に動作させたい場合は、フレームワークを使用する必要があります。たとえば、 Prototypeでは、次のように呼び出すことができます。

$("DIV_ID").getHeight();

DIV_IDdivのid属性に置き換えます。

Answer 2

これを確実に検出する方法はありません。表示されるテキストの量は、使用するフォント、行の高さ、文字間隔などのさまざまな要因によって異なります。フォントがテキスト全体で均一で、等幅の場合は、char-width とこれを取得するための高さですが、ブラウザー間で完全である可能性は低いです。