如题
怎么用原生js获取img高度,img没有设置height属性
这种方式offsetHeight可以获取高度
如果是这么写 offsetHeight clientHeight都不行
最新发现,就chrome不行。Firefox,IE的 offsetHeight,clientHeight,height都可以。chrome版本为47.0.2526.73 m,但是用jq img.height()却可以喔。
以下方法是不行的(就chrome不行,IE Firefox都可以)
<img id="img2" src="img/big-icon.png">
<script type="text/javascript">
var img = document.getElementById('img2');
console.log(img.height);
console.log(img.offsetHeight);
</script>
以下方法是是可以的,就加了onload
<img id="img2" src="img/big-icon.png">
<script type="text/javascript">
window.onload = function() {
var img = document.getElementById('img2');
console.log(img.height);
console.log(img.offsetHeight);
}
</script>
我会之后再在别的地方试试看是否是浏览器坏了
也不知道你的为啥不行,不行就贴代码。
<img id="img" src="http://ubmcmm.baidustatic.com/media/v1/0f0005yYIsGLBGDGfPud10.png">
<script type="text/javascript">
window.onload=function(){
var img = document.getElementById('img');
console.log(img.height);
console.log(img.offsetHeight);
}
</script>
图片设置高度的话会取到设置的,没设置的话是原始高度300px
我猜你是js写在图片前边了吧?
------补充你评论的问题----
<img id="img2" src="/usr/local/var/www/test/mac-noise-reduction.png">
<script type="text/javascript">
window.onload=function(){
var img = document.getElementById('img2');
console.log(img.height);
console.log(img.offsetHeight);
}
</script>
这样,也是可以正常获取到高度的,图片信息见下图:
---补充--
回复评论失败,好像是bug。
之前疏忽没加onload,不加的话表示页面加载到js就执行js,但此时页面的一些外部元素比如图片,CSS可能没加载完成,所以当然是取不到值的。
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。