关于img标签src找路径找不到问题

最新推荐文章于 2023-06-23 20:57:03 发布

原创最新推荐文章于 2023-06-23 20:57:03 发布 · 5.6k 阅读

2 ·

CC 4.0 BY-SA版权

js基础专栏收录该内容

36 篇文章

订阅专栏

本文介绍了几种使用JavaScript检查图片是否存在的方法，包括利用XMLHttpRequest发送请求判断状态码、通过创建Image对象检查尺寸及文件大小，以及使用onerror事件替换无法加载的图片。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、JS+XMLHTTP


var oreq = new ActiveXObject("Microsoft.XMLHTTP")
oreq.open("Get","blog/attachments/month_0606/s2006610204959.jpg",false);
oreq.send();
alert(oReq.status)
if(oReq.status==404)
alert('不存在');
else
alert("存在")
}

2、查看图片找的到嘛

 function CheckImgExists(imgurl) {  
    var ImgObj = new Image(); //判断图片是否存在  
    ImgObj.src = imgurl;  
    //没有图片，则返回-1  
    if (ImgObj.fileSize > 0 || (ImgObj.width > 0 && ImgObj.height > 0)) {  
        return true;  
    } else {  
        return false;
    }  
}

3、用onerror替换不存在的图片


<img src="images/img1.jpg" height="300" width="800" onerror="notFind(this)";">

<script>
function notFind(obj) {
    obj.src = "../images/LOGO.png";
    obj.onerror = null;//防止图片路径一直找不到而循环查找设置的onerror路径
}
</script>

这边再普及一下路径问题：

当前目录：./images/xxx.png

如何表示上级目录 ../images/xxx.png/表示源文件所在目录的上一级目录，../../images/xxx.png表示源文件所在目录的上上级目录，以此类推。