本节我们学习如何通过 jQuery 中提供的方法来获取或者设置元素的宽度和高度。
jQuery 中用于获取设置宽高的方法有如下所示：
| 方法 | 描述 |
|---|---|
| width() | 设置或返回元素的宽度 |
| height() | 设置或返回元素的高度 |
| innerWidth() | 返回元素的宽度，包括内边距 |
| innerHeight() | 返回元素的高度，包括内边距 |
| outerWidth() | 返回元素的宽度，包括内边距和边框 |
| outerHeight() | 返回元素的高度，包括内边距和边框 |
width()和height()方法
width() 方法和 height() 方法其实从字面意思就可以看出它们的作用，width() 方法用于设置或返回元素的宽度， height() 方法用于设置或返回元素的高度。
但是要注意，宽度和高度都不包括元素的内边距、外边距和边框的宽度。
示例：
例如我们获取下面这个矩形的宽度和高度：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery_侠课岛(9xkd.com)</title>
<script src="jquery-3.5.1.min.js"></script>
<script>
$(function(){
$("button").click(function(){
var w = $(".rect").width();
var h = $(".rect").height();
alert("元素的宽为：" + w + ", 元素的高为：" + h);
});
});
</script>
最低0.47元/天 解锁文章
3569
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
