我不知道为什么，但是当我在 IE9 兼容视图或 IE7 中从 IE 运行它时，clientWidth 和 clientHeight 总是返回零。它适用于其他一切。非常简单的有问题的代码片段（以便您也可以尝试）：http: //jsfiddle.net/nz2DA/
上面找到的代码片段如下......我有一个包含以下 HTML 片段的页面：
<div id='aaa'>aaaaaa</div>
我测试clientWidth和clientHeight函数的javascript如下：
var el = $('#aaa')[0];
alert('Client width and height: '+ el.clientWidth + ' X ' + el.clientHeight);
当我在 IE7 或 IE9 兼容模式下运行时，这总是会弹出“0 X 0”的警报。
任何帮助或解释将不胜感激。谢谢！
发生这种情况是因为 IE 中的“hasLayout”属性，而您的 div 本身没有“布局”。有关详细信息，请参阅http://www.satzansatz.de/cssd/onhavelayout.html
幸运的是，您可以触发元素进行布局，这就是为什么在上面的答案中添加“float:left”样式有效的原因。尽管不会更改页面，但您也可以使用其他触发器。这给了我正确的 clientWidth 和 clientHeight 值：
<div id="aaa" style="zoom: 1">aaaaaa</div>
文章说设置“min-width：0”也应该有效，但它不适合我。设置“显示：内联块”工作正常，但这可能会改变您的页面。您可以在 CSS 中设置这些触发器，这样 HTML 就根本不需要更改。
我测试了您的代码，以下是观察结果。
在 IE 中（糟透了！），如果您没有为“aaa”元素应用任何样式，IE 将不会计算任何宽度和高度。所以 JS 简单地给你 0。但是如果你从 IE 开发工具栏中查看盒子模型你会看到一些价值。因此，如果您使用float:left该元素，JS 将返回一个值，这是正确的，并且所有浏览器都会为您提供相同的输出。
既然您使用的是 jQuery，为什么不使用width()orouterWidth()或innerWidth(). 这些方法适用于每个浏览器。简单地说，如果你使用width()你会看到一个非常大的宽度，因为你没有应用任何样式。在 IE 中，如果元素没有浮点值，它会得到它的父宽度。在你的情况下，它是窗口宽度。
因此，如果我修改您的代码以获得正确的宽度和高度将是：
HTML：
<div id="aaa" style="float:left;">aaaaaa</div>
JS：
var el = $('#aaa')[0];
alert('Client width and height: '+ el.clientWidth + ' X ' + el.clientHeight);
如果您需要更多说明，请告诉我……干杯！
尝试Internet Explorer 的offsetHeight属性。