获取DIV宽度和高度的跨浏览器方法？

这是我的第一篇文章，所以请放轻松我。 我确定我做错了什么。 但是，我找不到任何回答上述问题的post。

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

.width（）和.height（）不起作用，因为在IE中，减去了填充（例如，width（）返回25，其中宽度为30，填充为5）。

.outerWidth（）和.outerHeight（）也不一致。 当他们在FF中工作IE（信不信由你）时，填充再次添加到整个宽度（例如，outerWidth（）在FF中返回110，其中宽度为100px，填充为10px）。

没有编写复杂的浏览器检查，有没有办法解决这个问题？ 谢谢！

Answer 1

在我看来，您需要向页面添加DOCTYPE以强制IE进入“符合标准”而不是“怪癖”模式。 请参阅Quirks模式和严格模式 。

另见width() ：

和outerWidth() ：

Answer 2

我不知道这是否有帮助，但是下面的片段将设置内部元素的高度，以便它完全填充可用空间。 内部元件（e）可以嵌套在具有设定高度的参考元件（r）内的任何深度处。 该片段考虑了e和r之间所有兄弟姐妹的高度。 这两个参数都可以作为DOM元素或JQuery对象传递。

 var fit_v = function ( e, r, no_set ){ if (!e.jquery) e = $(e); if (!r.jquery) r = $(r); var h, s, b = 0, d = 0; for (var i = 0; i < r[0].childNodes.length; i++){ s = $(r[0].childNodes[i]) d += s.outerHeight(); d += Math.max(b,parseInt(s.css('margin-top'))); b = parseInt(s.css('margin-bottom')); } d += b; h = r.height() - d; if (!no_set) e.height(h); return h; };