firefox浏览器bug:无src属性的 img 其高度宽度计算错误 - dongyuwei/blog GitHub Wiki
这也会影响到img父容器的高度,宽度计算。使用jquery时,计算其父容器box
的height,$('#box').height();
在firefox浏览器下面也是错误的。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<style>
#box{
padding: 0;
margin: 0;
}
img{
/*display: inline-block;*/
}
</style>
</head>
<body>
<div id='box'>
<img id='lazyImg' width='100' height='100' style='width:100px;height:100px;'>
</box>
<script>
var img = document.getElementById('lazyImg');
var box = document.getElementById('box');
console.log(img.offsetHeight,img.clientHeight);
console.log(box.offsetHeight,box.clientHeight);
</script>
</body>
</html>
要解决这个问题,需要 显式声明 img的display为 inline-block
。