版权声明:本文为博主原创文章,转载请注明出处。 https://blog.csdn.net/twilight_karl/article/details/71334258
- width([纯数字/带单位的字符串]) 返回宽度/设置宽度 (返回值是数字)
- width(function(index,width){}) 采用匿名函数
- height() 返回高度,用法与width()相同
效果和css(“width”)类似,css() 返回字符串(px)
alert("width:"+$("#div").width()); // 获得元素的宽度
$("#div").width('400px'); // 也可以设置宽度 400 / '400px'
alert($("#div").css("width")); // 返回带单位的字符串 400px
使用匿名函数控制宽度,index表示序号,width表示宽度
$("div").width(function(index,width){
if(index % 2 == 0 )
return width+100;
return width-100 ;
});
- innerWidth([value]) 宽度 包含内边距
- innerHeight([value]) 高度 包含内边距
- outerWidth([value]) 宽度 包含内边距和边框
- outerHeight([value]) 高度 包含内边距和边框
- outerWidth(true) 高度 包含内边距、边框、外边距
对于以下元素:
<body>
<div style="width:300px;height:300px;background-color:skyblue; padding:10px;border:solid 10px green; margin:10px;" id="div"></div>
</body>
alert("innerWidth:"+$("#div").innerWidth()); // 包含内边距 320
alert("outerWidth():"+$("#div").outerWidth()); // 包含内边距和边框 340
alert("outerWidth(true):"+$("#div").outerWidth(true)); // 包含内边距边框和外边距 360
- offset() 获取某个元素相对于可视区域的相对位置 返回一个对象两个属性left-top
- position() 相对于父元素的位置 返回对象
对于以下元素:
<body>
<div style="position:absolute; left:100px ; top:100px;">
<div style="width:300px;height:300px;background-color:skyblue; padding:10px;border:solid 10px green; margin:10px;" id="div"></div>
</div>
</body>
alert($("#div").offset().left); //110 在屏幕中的位置加上外边距的效果
alert($("#div").offset().top); //110
alert($("#div").position().left); // 0
alert($("#div").position().top); // 0
- scrollTop ([value]) 返回/设置滚动条的高
- scrollLeft(value) 返回/设置滚动条的宽
alert($(document).scrollTop());