如何在HTML文檔中用JavaScript替換損壞的圖像？

Question

我想知道如何用JavaScript替換src屬性（或刪除整個img節點），如果瀏覽器意識到的話，超出image-src屬性的圖像將不存在（不再存在）。

例如：

<div id="foo">
   <img src="bar">
</div>

img標簽指向無處。 在某些瀏覽器中，尤其是。 iE正在顯示“無圖像”叉號。 . 我更喜歡將bar替換為替代圖像url，或者將img-node替換為 。

我找到了一種方法 ，但實際上對我沒有用。

請僅向我建議使用PrototypeJS或原始JS的解決方案（該項目正在使用PrototypeJS，並且我不想在其他框架上進行重載）。

Answer 1

只需為圖像使用onerror處理程序，然后在處理程序內部刪除節點或更改src：

<img src="..." id="img-1"
     onerror="document.getElementById('img-1').src='working image';">

或替代地：

<img src="..." id="img-1"
     onerror="document.getElementById('img-1').parentNode.removeChild(document.getElementById('img-1'));">

最好將其編寫為事件處理程序，並將其附加到文檔中的所有圖像上。