JavaScript判断图片尺寸与加载状态的方法

JavaScript判断图片尺寸与加载状态的方法

在Web开发中，判断图片尺寸通常借助Image对象，并通过attr方法获取图片地址后进行判断。以下是一个简单的实现示例。

var img=new Image();
img.src=$('#tlogo').attr('src');
if(img.width > '240'){
$('#tlogo').attr('width','240');
}

上述方法存在一个问题：如果页面尚未完全加载，JavaScript可能无法正确获取图片尺寸。因此，我们需要先判断图片是否加载完成，再进行尺寸判断。

<img id="img2" src="images/1.jpg" />
<script language="JavaScript">
document.getElementById("img2").onload = function () {
alert("图片加载已完成");
    }
</script>

或者，可以使用jQuery来实现相同的功能：

$("#imageId").load(function(){
alert("加载完成！");
});

基于以上方法，我们可以对代码进行优化，确保在图片加载完成后获取其尺寸并做出相应调整。

$("#tlogo").load(function(){
var img=new Image();
img.src=$('#tlogo').attr('src');
if(img.width > '240'){
$('#tlogo').attr('width','240');
}
});

注意：#tlogo 是图片地址中指定的ID，这是必须设置的。