4

私が持っていると言う：

<div>Some variable amount of text.</div>

div内のテキストの幅（ピクセル単位）を取得するにはどうすればよいですか？

テキストの量はdivごとに予測できないほど変化することに注意してください。

ありがとう！

4

6 に答える 6

4

他の人が提供しているdiv自体ではなく、コンテンツの幅が必要なようです。スパンの幅を測定できるように、内容物をスパンで包む必要があると思います。divは常に可能な限り広くなります。代わりに測定できるコンテンツのサイズに折りたたまれる何かが必要です。

于 2011-03-15T22:17:01.820 に答える
3

私が見つけた最善の方法は、CSSルールを使用して、指定されたHTML要素"display:inline;"のみをバインドしてから、 JSメソッドを使用することです。textNodeoffsetWidth

<div style="display:inline;" id="gotWidthInPixels" >Some variable amount of text.</div>
<script>
  //either:
  var widthInPixels= $('#gotWidthInPixels')[0].offsetWidth; 
  //or
  var widthInPixels= document.getElementById("gotWidthInPixels").offsetWidth;
</script>

これにより、HTML要素の正確な幅がピクセル単位で表示されます。

于 2011-05-05T14:15:09.753 に答える
0 
var w = $('div').width()

または、divに他のセレクターを使用します

于 2011-03-15T22:04:39.403 に答える
0

次のようにwidth（）を使用してください。

<div id="mydiv">text text text</div>
<script>
alert( $('#mydiv').width() );
</script>
于 2011-03-15T22:05:38.667 に答える
0

@mrtshermanに関しては、使用できるテキストだけの幅が必要な場合

var myDiv = $('#myDiv'); 

//div width
var textWidth = sb.width();

//remove padding and margin from left and right
textWidth -= parseInt(sb.css('padding-left') ) + parseInt(sb.css('margin-left') );
textWidth -= parseInt(sb.css('padding-right') ) + parseInt(sb.css('margin-right') );
于 2011-03-15T22:59:05.283 に答える
0

jqueryで幅の計算を壊す空白スペースがあるという奇妙な問題がありました。文字列変数と連結、またはJMVCフレームワーク、あるいは単にjQueryが原因であるかどうかは、正確にはわかりません。

ただし、スペースを非ブレークスペースにする

&nbsp;

それを解決したようです。それが役立つ場合に備えて、それを捨てるだけです。

于 2013-08-20T18:42:22.387 に答える