这里文本超出容器时将用显示省略号显示, text… text… abc66666666666666666666666
</div>
二、jQuery获取DOM对象的高宽问题
高度有关的方法有: height(), outerHeight(), outerHeight(true), 宽度有关的方法有:width(), outerWidth(), outerWidth(true)
假如有id=div_id的div对象,那求出各种宽高如下:
$(“#div_id”).height() / $(“#div_id”).width(); // 获得的是该div本身的高 / 宽度, (不包含padding,margin,border)
$(“#div_id”).outerHeight() / $(“#div_id”).outerWidth(); // 包含该div本身的高 / 宽度, padding上下的高 / 宽度, 以及border上下的高 / 宽度(不包含margin的高 / 宽度)
$(“#div_id”).outerHeight(true) / $(“#div_id”).outerWidth(true); // 包含该div本身的高 / 宽度, 以及padding,border,margin上下的总高 / 宽度
举例:
<div id=”testDiv” style=”margin:10px 5px; width:600px; padding:10px 20px; height:60px; border:2px solid red; font-family:arial,verdana;”>
div info: height : 30px, width : 500px, padding:10px 20px; margin:10px 5px,
</div>
<input type=”button” value=”TEST” id=”btnTest” onclick=”testHeight();”/>
<script type=”text/javascript”>
function testHeight(){
var obj = $(‘#testDiv’);
alert(‘obj height = ‘ + obj.height() + ‘nobj outerHeight = ‘ + obj.outerHeight() + ‘nobj outerHeight(true) = ‘ + obj.outerHeight(true));
alert(‘obj width = ‘ + obj.width() + ‘nobj outerWidth = ‘ + obj.outerWidth() + ‘nobj outerWidth(true) = ‘ + obj.outerWidth(true));
}
</script>










