用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

回答

相关问题