jquery innerwidth jQuery innerWidth() 方法

jquery innerwidth

jQuery innerWidth() 方法用于获取元素的内部宽度，包括内边距，但不包括边框和外边距。

// 获取元素的内部宽度
var width = $( "#myDiv" ).innerWidth(); 

innerWidth() 方法返回一个数字，表示元素的内部宽度（以像素为单位）。如果未指定参数，则返回当前元素的内部宽度。如果要将新的宽度分配给元素，请使用 width() 方法。

innerWidth() 方法也可以传递一个可选的数字参数来设置元素的内部宽度。该方法会将新的宽度分配给元素，并返回 jQuery 对象以便链式调用。

 
// 设置元素的内部宽度为 500px 
$( "#myDiv" ).innerWidth( 500 );  // 返回 jQuery 对象以便链式调用 

innerWidth() 方法也可以传递一个带有单位的字符串参数来设置元素的内部宽度。该方法会将新的宽度分配给元素，并返回 jQuery 对象以便链式调用。

 
 // 设置元素的内部宽度为 50% 
 $( "#myDiv" ).innerWidth( "50%" ); // 返回 jQuery 对象以便链式调用   

jQuery innerWidth() 方法是一个很有用的方法，能够帮助我们快速地测量和修改 DOM 元素中物理尺寸相关属性值。此外，我们也可以使用 innerHeight() 来测量 DOM 元素中物理尺寸相关属性值。

jQuery innerWidth() 方法

jQuery innerWidth() 方法

jQuery HTML/CSS 方法

实例

返回 <div> 元素的内部宽度：

$("button").click(function(){
alert($("div").innerWidth());
});

---

定义和用法

innerWidth() 方法返回第一个匹配元素的内部宽度。

如下面的图像所示，该方法包含 padding，但不包含 border 和 margin。

---

相关方法：

• width() - 设置或返回元素的宽度
• height() - 设置或返回元素的高度
• innerHeight() - 返回元素的高度（包含 padding）
• outerWidth() - 返回元素的宽度（包含 padding 和 border）
• outerHeight() - 返回元素的高度（包含 padding 和 border）

---

语法

$(selector).innerWidth()

---

更多实例

通过相关方法显示尺寸
如何使用 width()、height()、innerHeight()、innerWidth()、outerWidth() 和 outerHeight()。

---

jQuery HTML/CSS 方法