如何在加载其宽度/高度最初由PERCENTAGE设置后获取某些元素的实际宽度/高度？

Question

我有一个iframe，其内容指向HTML文档。

在该HTML文档中，有一个指向PDF文档的EMBED元素。这个EMBED最初设置的宽度和高度为PERCENTAGE（例如：width: 100%; height: 100%）。

我的问题是：

加载iframe后，如何检索EMBED元素的实际，绝对宽度和高度（在任何单位px，pt，em等中）。

我一直在尝试所有可能的js属性（宽度，高度，样式：clientWidth，clientHeight，offsetWidth，offsetHeight ......）以及jQuery（例如outerWidth，outerHeight等），但似乎没有希望。

Answer 1

这应该返回你需要的东西：

document.getElementById("id").clientHeight 
document.getElementById("id").clientWidth 

id是EMBED元素的唯一ID。

有关此内容的更多信息：

https://developer.mozilla.org/en/DOM:element.clientHeight

https://developer.mozilla.org/en/DOM:element.clientWidth

Answer 2

http://jsfiddle.net/purmou/9XXwf/2/

这使用jQuery的width()和height()。目前它找到一个对象的总宽度/高度，包括填充，边框，边距等。如果您想要找到元素本身的宽度和高度，不包括边框等，请替换{{1} } var width = this.offsetWidth;和var width = $(this).width(); var height = this.offsetHeight;。

Answer 3

您应该使用.offsetWidth和.offsetHeight属性。 注意！它们属于元素，而不是element.style。

var width = document.getElementById('foo').offsetWidth; 

适用于所有现代浏览器。 但要小心！如果您最近对元素进行了某些DOM修改，则offsetWidth / offsetHeight可以返回0。修改元素后，可能必须在setTimeout调用中调用此代码。也许这是你的问题？