jquery outerHeight方法 outerWidth方法 获取元素实际宽度高度

曾经写代码中,每当须要获取元素的实际“宽度”(这里的宽度是指元素宽度加上其边距)时,都须要用元素宽度加上margin值才行,今天发现一个叫outerWidth(options)的方法 ,非常好用。

完毕了原来须要用一段来操作做的工作。


这种方法不适用于window 和 document对象,能够使用.width()取代。
以下是其简介
outerWidth(options)
获取第一个匹配元素外部宽度(默认包含补白和边框)。


此方法对可见和隐藏元素均有效。
返回值:Integer 一个整数值 不带"px"
參数:
options(Boolean) : 默认值为false  设置为 true 时,计算边距在内。
演示样例:
获取第一段落外部宽度。

HTML 代码:
<div>
<div id="test" style="width:80px;margin:10px;"></div>
</div>

jQuery 代码:
var w = $("#test").outerWidth(true);
$("#test").html(w);

结果:
<div>
<div id="test" style="width:80px;margin:10px;">100</div>
</div>


outerHeight(options)

获取第一个匹配元素外部高度(默认包含补白和边框)。
此方法对可见和隐藏元素均有效。


返回值:Integer
參数:
options(Boolean) : 默认值为false  设置为 true 时,计算边距在内。
演示样例:
获取第一段落外部高度。

HTML 代码:

<div>
<div id="test" style="height:20px;margin:10px;"></div>
</div>

jQuery 代码:
var h = $("#test").outerHeight(true);
$("#test").html(h);

结果:
<div>
<div id="test" style="height:20px;margin:10px;">40</div>
</div>

</div>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值