检查是否存在缩略图和图像

Question

我正在尝试在需要加载三个图像之一的页面中编写一些javascript。首先，它需要检查图片的缩略图是否存在，如果缩略图不存在，则检查full_size图像并显示该缩略图(缩小)，如果缩略图或全尺寸图像都不存在，则使用noimage.gif作为小占位符。做这件事最有效的方法是什么？

一些规定，不能在服务器端做，因为没有服务器。这个java脚本将作为.我正在映射一个光纤网络，这是手孔部分。基本上，每个地标将有1到5张图片，图片的名称将与地标名称相同，并在每张图片后添加-1、-2、-3等。所以这些地标中的每一个都从相同的气球样式中获得了自己的样式。我以这种气球样式编写的html名为img src=“./width=/ $name -1.jpg”height=“120px”height="100px“，其中$name插入地标的名称。这将允许用户，当他们更新kml文件并添加新的placemark时，他们所要做的就是重命名jpeg以匹配placemark的名称，并在其末尾添加-1并将其转储到图像文件夹中。使用户不必编辑任何html (这对他们来说太多了)

Answer 1

我将在服务器上执行检查，然后让服务器提供可用映像的资源路径。

Answer 2

我同意@Jason Dean，，但如果你想通过使用JavaScript来检测它，我会这样做:当获得缩略图时，我会附加某种id/属性到它，并检查它是否存在。

检查img-tumb的id是否存在：

var imgThumb = document.getElementById("img-thumb");
if (imgThumb != null){
    alert("Thumbnail exists");
}else{
//Check Image size...

现在检查图像大小：(放在last if的else之后)

var img = document.getElementById('your_image_id'); 
var height = img.clientHeight;
var width = img.clientWidth;

要在检测到图像高度后更改高度：

img.style.height = height-50;//Substracks 50 pixles from the original size
img.style.width = width-50;//Substracks 50 pixles from the original size

对于最后的事件(当没有检测到任何事件时)，我将使用与第一阶段相同的检查。

完整代码：

 var imgThumb = document.getElementById("img-thumb");
 var imgFull = document.getElementById("img-full");//Full sized image
    if (imgThumb != null){
        alert("Thumbnail exists");
    }else if(imgFull != null){
    //Check Image size...
    alert("Full sized image exists");
    var img = document.getElementById('your_image_id'); 
    var height = img.clientHeight;
    var width = img.clientWidth;
    img.style.height = height-50;//Substracks 50 pixles from the original size
    img.style.width = width-50;//Substracks 50 pixles from the original size

    }else{
    //Place noimage.gif
}