用jQuery更改圖像src

我正在替換舊應用程序中的一些代碼，而不是通過它的id獲取節點，我通過它的類來獲取它。因爲沒有好的方法通過它的本地JS類來獲取節點，所以我使用jQuery來實現它，但是新代碼不會更改img src。用jQuery更改圖像src

是否有明顯的原因？

舊代碼：

var gamearea = document.getElementById('gamearea') 
var images = gamearea.getElementsByTagName('img'); 
images[place] = "pics/" + id + ".png";

新代碼：

$('.gamearea').children('img').eq(place).src = "pics/" + id + ".png";

來源

2011-12-18 holyredbeard

什麼是你的HTML標記？ – 2011-12-18 17:50:18

有「好」的方式來獲取他們的'className'（沒有選擇器）的元素。你只是短視。正如David所說，請發佈您的HTML，以便可以發佈更好的解決方案。 – 2011-12-18 17:52:58

@Matt：雖然確實有很好的方法，比如'document.getElementsByClassName（）'，但jQuery *可以讓它更容易跨瀏覽器，從而補償OR。 – 2011-12-18 18:02:07

.eq()返回一個jQuery對象。如果您想直接使用.src屬性，你需要一個DOM元素（不是一個jQuery對象），你會用.get()代替.eq()這樣的：

$('.gamearea').find('img').get(place).src = "pics/" + id + ".png";

我也切換到.find()，而不是.children()是更相當於原始版本中的.getElementsByTagName()，因爲您沒有向我們展示您的HTML，所以這似乎是一個更安全的假設。

來源

2011-12-18 17:57:45 jfriend00

工程就像一個魅力，謝謝！ – holyredbeard 2011-12-18 18:04:27

嘗試：

$('.gamearea').children('img').eq(place)[0].src = "pics/" + id + ".png";

或：

$('.gamearea').children('img').eq(place).attr("src", "pics/" + id + ".png");

$('.gamearea').children('img').eq(place)返回元素的jQuery「數組」，您無法直接在此對象上訪問DOM屬性。您需要通過使用[0]（第一個元素）或使用jQuery API中的方法來拉動DOM元素，在這種情況下爲.attr()。

此外，您可能意味着使用$('#gamearea')而不是$('.gamearea')如果您要更換getElementById('gamearea');

來源

2011-12-18 17:50:09 David

function updateGameAreaImages(id, place) { 
    var gameareas = toArray(document.getElementsByClassName('gamearea')); 
    gameareas.forEach(updateImages); 

    function updateImages(elem) { 
     var images = elem.getElementsByTagName("img"); 
     images[place].src = "pics/" + id + ".png"; 
    } 
} 

function toArray(obj) { 
    var arr = []; 
    for (var i = 0, len = obj.length; i < len; i++) { 
     arr[i] = obj[i]; 
    } 
    return arr; 
}

來源

2011-12-18 18:05:30 Raynos

我知道這是一個古老的答案，但肯定這是一個更好的辦法...

$('.gamearea').children('img').attr("src", "pics/" + id + ".png");

來源

2013-01-02 12:04:09

用jQuery更改圖像src

回答

相關問題