1

固定幅と固定高さの親 div があります。

コンテンツがこれを超える可能性があるので、Javascript でコンテンツが固定サイズを超えているかどうかを計算する方法はあるのでしょうか?

例は次のようになります。

<div style="width:20px;height:20px;overflow-x:hidden;overflow-y:hidden;">

 A sentence that exceeds the width!

</div>

上記の場合、幅を超えています。これはJavascriptでどのように達成されますか?

4

2 に答える 2

1

div および text ノードのDOM プロパティを使用できます。要素内でテキストを折り返すことができれば<span>、寸法プロパティの操作が簡単になりそうです。

html

<div id="container">
  <span>A sentence that exceeds the width!</span>
</div>

CSS

div {
    width:50px;
    overflow:hidden;
    white-space: nowrap;
}

js

var cont = document.getElementById('container');
var spn = cont.getElementsByTagName('span')[0];
//alert(cont.clientWidth);
//alert(spn.offsetWidth);

if(spn.offsetWidth > cont.clientWidth) {
    alert("content exceeds width of parent div");
}

http://jsfiddle.net/Bn2Uc/2/

于 2013-11-11T23:30:39.843 に答える
1

コンテンツの親を作成:

<div style="width:20px;height:20px;overflow-x:hidden;overflow-y:hidden;">
 <div id="parent">
 A sentence that exceeds the width!

</div>
</div>

親の幅と高さを取得して、メインの div と比較できるようになりました。

var h = document.getElementById("parent").offsetHeight;
var w = document.getElementById("parent").offsetWidth;
于 2013-11-11T23:20:30.010 に答える