javascript 中的offsetHeight问题
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了javascript 中的offsetHeight问题相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html><html lang="en"><head>一个很简单的例子，但我用offsetHeight得到的高是21，但实际上11.png宽高都是259px，找了很久也没有找到原因，有明白人能说一下吗？ <meta charset="UTF-8"> <title>Document</title></head><style></style><body> <div class="box" id="pic"><img src="11.png" alt=""></div></div> <script> function my(id) return document.getElementById(id); var cc=my("pic").offsetHeight; my("pic").style.opacity = "0.4"; console.log(cc); </script></body></html>
还有一种情况就是假如div的height是默认的（即auto），但你获取的时候页面尚未加载完毕（也就是说这时候图片还没有渲染完毕），这时候的offsetHeight也是不准确的。应该在window.onload事件中去获取，这个时候页面已经完全加载完毕了。 参考技术A 因为图片加载需要时间，你的代码在获取div的offsetHeight的时候，图片还没有加载完成，所以得到的高度没有包含图片。
可以把获取offsetHeight的方法写在图片的onload事件里，或者等图片加载后再获取。本回答被提问者采纳
以上是关于javascript 中的offsetHeight问题的主要内容，如果未能解决你的问题，请参考以下文章
javascript获取浏览器的高度和宽度(documentElement,clientHeight,offsetHeight,scrollHeight,scrollTop,offsetParent,
深入理解定位父级offsetParent及偏移大小offsetTop / offsetLeft / offsetHeight / offsetWidth