首页 > 加载图片怎么得到大小?

加载图片怎么得到大小?

<!DOCTYPE HTML>
<html lang="ru-RU">
<head>
  <title></title>
  <meta charset="UTF-8">
</head>
<body>


<div id='w'>

</div>


<script type="text/javascript">


window.onload=function ()
{
alert(this.size);
 var url="http://img5.cache.netease.com/news/2016/6/18/2016061808324376432.jpg";
 var img=new Image();

img.onload=function (o)
{
alert(this.size);

  document.getElementById('w').innerHTML='<img src="'+url+'" />';
}
img.src=url;
  

}

</script>
</body>
</html>

Image是一个DOM对象,W3C上没找到size属性,你可以获取height和width。
你的第一个alert的this指向window,不过即使改成img.height也获取不到,因为加载还没完成,争取的方法是在onload里面获取。


img.onload=function (o)
{
    alert(this.width);
    alert(this.height);
    document.getElementById('w').innerHTML='<img src="'+url+'" />';
}

建议你最好是让后端通过data-数据把宽高存起来,到时候只用获取数据就好。就算在页面onload的时候去通过width或者height方法去获取宽高会比较的浪费性能。


用jquery生成一个src为你图片地址的$对象隐藏的形式append到dom 获取width height后remove

【热门文章】
【热门文章】