jQuery 中宽度、innerWidth 和outerWidth、高度、innerHeight 和outerHeight 之间有什么区别

jQuery 中的宽度、innerWidth 和 outerWidth、高度、innerHeight 和 outerHeight 是用来获取和设置元素尺寸的方法。它们之间有一些区别，下面将逐一介绍。

var width = $(element).width();

var innerWidth = $(element).innerWidth();

var outerWidth = $(element).outerWidth();

html

javascript
// 获取元素的宽度
var width = $('#box').width();
console.log('宽度：' + width);
// 获取元素的内部宽度
var innerWidth = $('#box').innerWidth();
console.log('内部宽度：' + innerWidth);
// 获取元素的外部宽度
var outerWidth = $('#box').outerWidth();
console.log('外部宽度：' + outerWidth);
// 设置元素的宽度
$('#box').width(300);
// 获取元素的高度
var height = $('#box').height();
console.log('高度：' + height);
// 获取元素的内部高度
var innerHeight = $('#box').innerHeight();
console.log('内部高度：' + innerHeight);
// 获取元素的外部高度
var outerHeight = $('#box').outerHeight();
console.log('外部高度：' + outerHeight);
// 设置元素的高度
$('#box').height(200);