用jQuery動態替換img src屬性

Question

我想用jQuery替換給定源的img源。例如，當圖像src是smith.gif時，請替換爲johnson.gif。如果williams.gif替換爲brown.gif等

編輯：圖像從XML檢索到隨機順序，沒有類到每個。

這是我的嘗試：

if ($("img").attr('src', 'http://example.com/smith.gif')) { 
       $(this).attr('src', 'http://example.com/johnson.gif'); 
      } 
if ($("img").attr('src', 'http://example.com/williams.gif')) { 
       $(this).attr('src', 'http://example.com/brown.gif'); 
      } 

請注意，我的HTML有許多圖像。例如

<img src="http://example.com/smith.gif"> 
<img src="http://example.com/williams.gif"> 
<img src="http://example.com/chris.gif"> 

等

所以，我怎麼能更換圖片：IF IMG SRC = 「http://example.com/smith.gif」 然後顯示「HTTP：//例子.COM/williams.gif」。等等

非常感謝

Answer 1

這是你想做的事：

var oldSrc = 'http://example.com/smith.gif'; 
var newSrc = 'http://example.com/johnson.gif'; 
$('img[src="' + oldSrc + '"]').attr('src', newSrc); 

Answer 2

您需要在jQuery的文檔檢查出attr方法。你在濫用它。您在if語句中所做的操作只是將第二個參數中指定的字符串替換爲所有圖像標記src。

http://api.jquery.com/attr/

一種更好的方式來處理更換一系列圖像源將遍歷每檢查它的來源。

例子：

$('img').each(function() { 
    var curSrc = $(this).attr('src'); 
    if (curSrc === 'http://example.com/smith.gif') { 
     $(this).attr('src', 'http://example.com/johnson.gif'); 
    } 
    if (curSrc === 'http://example.com/williams.gif') { 
     $(this).attr('src', 'http://example.com/brown.gif'); 
    } 
});