Js判断图片是否存在的几种方法
1、
function CheckImgExists(imgurl) {
var ImgObj = newImage(); //判断图片是否存在
ImgObj.src = imgurl;
//没有图片,则返回-1
if (ImgObj.fileSize> 0 || (ImgObj.width > 0&& ImgObj.height >0)) {
return true;
} else {
return false;
}
}
首先这个方法有几点不得不注意:
我们通过判断ImgObj大小而判断图片路径是否存在,这样是由问题的,因为
图片路径就算是真正存在的,由于mgObj.src = imgurl; 执行完后
ImgObj实际上还没有吸收图片过来,这样判断大小可能就算0
(实验证明的,确实有延迟效应)
解决方案是在ImgObj 在onload完成之后判断即可
第二点,我使用这个方法的目的是为了判断路径是否存在,再决定给img标签是否src赋值,
本来想借此跳过报错,其实不想的,测试发现如果图片路径的ip和端口号存在,那么
脚本报错还是有的,这一点也是不得不承认的。
从我的需求来看,就算我能准确判断是否存在,也无法满足我的需求了!
测试代码:
<p>
JavaScript 能够直接写入 HTML 输出流中:
</p>
<script>
function CheckImgExists(imgurl) {
var ImgObj = new Image();
ImgObj.src = imgurl;
if (ImgObj.fileSize > 0 || (ImgObj.width > 0 && ImgObj.height > 0)) {
return true;
} else {
return false;
}
}
alert(CheckImgExists("http://www.baidu.com/img/bdlogo.gif?t=3"));
</script>
<p>
您只能在 HTML 输出流中使用 <strong>document.write</strong>。
如果您在文档已加载后使用它(比如在函数中),会覆盖整个文档。
</p>
t=3后,第一次是返回false,第二次返回true,因为第一次加载慢,所以没来及到ImgObj对象中,所以判断不存在,第二次有缓存,马上到ImgObj里面了,所以判断正确!
还要其他的判断方式,有空可以看看这篇博客:http://blog.sina.com.cn/s/blog_4e893efb0101gwig.html
首先这个方法有几点不得不注意:
我们通过判断ImgObj大小而判断图片路径是否存在,这样是由问题的,因为
图片路径就算是真正存在的,由于mgObj.src = imgurl; 执行完后
ImgObj实际上还没有吸收图片过来,这样判断大小可能就算0
(实验证明的,确实有延迟效应)
解决方案是在ImgObj 在onload完成之后判断即可
本来想借此跳过报错,其实不想的,测试发现如果图片路径的ip和端口号存在,那么
脚本报错还是有的,这一点也是不得不承认的。
从我的需求来看,就算我能准确判断是否存在,也无法满足我的需求了!
测试代码:
<p>
JavaScript 能够直接写入 HTML 输出流中:
</p>
<script>
function CheckImgExists(imgurl) {
var ImgObj = new Image();
ImgObj.src = imgurl;
if (ImgObj.fileSize > 0 || (ImgObj.width > 0 && ImgObj.height > 0)) {
return true;
} else {
return false;
}
}
alert(CheckImgExists("http://www.baidu.com/img/bdlogo.gif?t=3"));
</script>
<p>
您只能在 HTML 输出流中使用 <strong>document.write</strong>。
如果您在文档已加载后使用它(比如在函数中),会覆盖整个文档。
</p>
t=3后,第一次是返回false,第二次返回true,因为第一次加载慢,所以没来及到ImgObj对象中,所以判断不存在,第二次有缓存,马上到ImgObj里面了,所以判断正确!
还要其他的判断方式,有空可以看看这篇博客:http://blog.sina.com.cn/s/blog_4e893efb0101gwig.html