如何获取页面上元素的宽度和高度？

Question

在可爱的jQuery的帮助下？

Answer 1

jQuery有两种方法，宽度和高度来做这件事：

$(".myElement").width();
$(".myElement").height();

您也可以使用它们来设置值：

$(".myElement").width(200); // set element to 200px

有关详细信息，请参阅文档：http://api.jquery.com/width/和http://api.jquery.com/height/

注意other dimension methods也可用：

• $.innerHeight() - 获取匹配元素集中第一个元素的当前计算高度，包括填充但不包含边框。
• $.innerWidth() - 获取匹配元素集中第一个元素的当前计算宽度，包括填充但不包含边框。
• $.outerHeight() - 获取匹配元素集中第一个元素的当前计算高度，包括填充和边框。
• $.outerWidth() - 获取匹配元素集中第一个元素的当前计算宽度，包括填充和边框。

Answer 2

使用height(...)和width(...)方法：

alert($(body).height());
alert($(body).width());

Answer 3

你永远猜不到......

var width = $(selector).width();
var height = $(selector).height();

Answer 4

在各种有用的情况下， Mac Firefox / Mozilla上的宽度值通常是错误的。

- 错误意味着如果你将一个封闭的div设置为text-child的报告“宽度”，你就会得到包装。

问题是在Mac Firefox / Mozilla上，Firefox使用子像素字体渲染。返回的宽度是地板，而不是真实宽度的上限，这是一个浮点数。

我的bug report为Firefox提供了一种解决方法，或者只是总是向宽度添加1px，你就可以了。