如何为img setAttribute设置后备图像

时间:2012-12-21 19:26:46

标签: javascript image setattribute

我有一个img元素:

var photo = document.createElement("img"); 

由照片提供,其名称存储在一个对象数组中,所以我“照片”这样的照片:

photo.setAttribute('src', './pics/' + myarray[id].Name + '.jpg');

它完美无缺。

唯一不起作用的是为没有pic的元素设置一个带默认照片的属性。

我试图在那一行之上做一个setAttribute行,为所有元素设置一个“默认”图片,希望第二行用正确的图片替换有一个的元素,并保留默认值那些没有被触及,但没有...... console.log仍然显示出期待name+jpg方案的信息,它完全忽略了我之前的路线(所以我很确定它不是如何工作的。)

因此,如果你有一个img元素,通过数组有很多实例,那么将默认图片分配给图片未指定用途的元素的最佳方法是什么?

谢谢!

2 个答案:

答案 0 :(得分:2)

你能使用jQuery吗?这是您描述的问题的解决方案。如果图像以404的形式返回,则会获得应用的默认图像

http://jsfiddle.net/gunderson/D3DSt/

var photo = document.createElement("img");
photo.setAttribute("id", "myPhoto");
$('body').append(photo);

$("#myPhoto").attr("src", 'alogo3w.png').error(function() {
    $(this).attr("src", "https://www.google.com/images/srpr/logo3w.png");
  })
​

答案 1 :(得分:1)

只在必要时设置默认值

photo.setAttribute('src', './pics/' + ( myarray[id].Name ? myarray[id].Name : 'default' ) + '.jpg');