jQuery如何获取元素宽高？

在jQuery中，获取元素的宽和高有多种方法，取决于你是否需要包括边框、内边距或其他额外空间。以下是几种常用的方式：

1. 获取元素内容区域的宽和高（不包括边框和内边距）：

   var width = $('#yourElement').width();
   var height = $('#yourElement').height();

2. 获取元素的总宽和高，包括内边距（但不包括边框）：

   var innerWidth = $('#yourElement').innerWidth();
   var innerHeight = $('#yourElement').innerHeight();

3. 获取元素的外部宽和高，包括边框和内边距：

   var outerWidth = $('#yourElement').outerWidth();
   var outerHeight = $('#yourElement').outerHeight();

   如果你想连同水平方向的滚动条（如果有的话）也包括进去，可以这样写：

   var outerWidthWithScroll = $('#yourElement').outerWidth(true);
   var outerHeightWithScroll = $('#yourElement').outerHeight(true);

4. 使用原生JavaScript属性： 如果你不需要jQuery特定的功能，也可以直接使用原生JavaScript属性来获取更为精确的尺寸信息，这通常与jQuery提供的功能相对应：

   var element = document.getElementById('yourElement');
   var clientWidth = element.clientWidth;
   var clientHeight = element.clientHeight; // 内容区域加内边距，不包括边框
   var offsetWidth = element.offsetWidth;
   var offsetHeight = element.offsetHeight; // 包括内容、内边距和边框

请注意，.width() 和 .height() 在未指定参数时获取的是内容区域的尺寸，若要获取考虑窗口滚动条影响的完整尺寸，可以使用 .outerWidth() 或 .outerHeight() 并传入布尔值 true。同时，请确保在DOM加载完成后执行这些操作，避免在元素尚未渲染完成时获取不到正确的尺寸。