获取DIV的宽度和高度的跨浏览器方法？ [英] Cross-browser method for getting width and height of a DIV?

问题描述

这是我的第一篇文章，所以请容易在我。我相信我做的一切都错了。但是，我找不到任何回答上述问题的帖子。

我使用jQuery。我试图找到一种方法来获取DIV元素的当前宽度和高度，即使它们设置为自动。我发现很多方法来做到这一点，但没有方法在IE中返回相同的宽度。重要的是，这种方法是跨浏览器，因为如果在不同的浏览器中返回不同的数字，它会破坏页面的布局。

.width（）和。 height（）不工作，因为在IE中，减去padding（例如width（）返回25，其中width为30，填充为5）。

.outerWidth .outerHeight（）也不一致。虽然他们在FF中工作IE（相信或不相信），但是填充被再次添加到全宽度（例如，outerWidth（）在FF中返回110，其中宽度为100像素，填充为10像素）。

有没有办法摆脱这个混乱，没有编写复杂的浏览器检查？感谢！

解决方案

听起来我需要添加：

This is my first post, so please go easy on me. I'm sure I'm doing everything wrong. However, I couldn't find any posts that answered the question above.

I use jQuery. I'm trying to find a way to get the current width and height of a DIV element, even if they're set to "auto". I've found many ways to do this, but no method returns the same width in IE. It is important that this method is cross-browser, as it will break the layout of the page if different numbers are returned in different browsers.

.width() and .height() do not work because in IE, padding is subtracted (e.g. width() returns 25 where width is 30 and padding is 5).

.outerWidth() and .outerHeight() are not consistent either. While they work IE (believe it or not) in FF, the padding is added again to the full width (e.g. outerWidth() returns 110 in FF where width is 100px and padding is 10px).

Is there any way out of this mess without writing complex browser checks? Thanks!

解决方案

It sounds to me that you need to add a DOCTYPE to your page to force IE into "standards compliant" rather than "quirks" mode. See Quirks mode and strict mode.

Also see width():

and outerWidth():

这篇关于获取DIV的宽度和高度的跨浏览器方法？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！