jQuery 尺寸

在 web 开发中，经常需要获取和设置元素的尺寸，jQuery 提供了一些方法来方便地操作元素的尺寸。

获取元素的尺寸

获取元素的宽度和高度

要获取元素的宽度和高度，可以使用 jQuery 的 width() 和 height() 方法。

// 获取元素的宽度
var width = $('#element').width();

// 获取元素的高度
var height = $('#element').height();

获取元素的内部尺寸

如果需要获取元素的内部尺寸（不包括边框和内边距），可以使用 innerWidth() 和 innerHeight() 方法。

// 获取元素的内部宽度
var innerWidth = $('#element').innerWidth();

// 获取元素的内部高度
var innerHeight = $('#element').innerHeight();

获取元素的外部尺寸

如果需要获取元素的外部尺寸（包括边框和内边距），可以使用 outerWidth() 和 outerHeight() 方法。

// 获取元素的外部宽度
var outerWidth = $('#element').outerWidth();

// 获取元素的外部高度
var outerHeight = $('#element').outerHeight();

设置元素的尺寸

设置元素的宽度和高度

要设置元素的宽度和高度，可以使用 jQuery 的 width(value) 和 height(value) 方法。

// 设置元素的宽度为 200px
$('#element').width(200);

// 设置元素的高度为 100px
$('#element').height(100);

设置元素的内部尺寸

如果需要设置元素的内部尺寸，可以使用 innerWidth(value) 和 innerHeight(value) 方法。

// 设置元素的内部宽度为 150px
$('#element').innerWidth(150);

// 设置元素的内部高度为 80px
$('#element').innerHeight(80);

设置元素的外部尺寸

如果需要设置元素的外部尺寸，可以使用 outerWidth(value) 和 outerHeight(value) 方法。

// 设置元素的外部宽度为 250px
$('#element').outerWidth(250);

// 设置元素的外部高度为 120px
$('#element').outerHeight(120);

以上就是关于 jQuery 尺寸的详细介绍，希望能帮助你更好地操作和控制元素的尺寸。