Question

我正在替换旧应用程序中的某些代码，而不是通过它获取节点的ID，而是通过它的类来获取它。因为在本机JS中没有一个通过它的类来获取节点的好方法我用jQuery来做，但新代码并没有改变img 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";

Answer 1

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;
}

Answer 2

尝试：

$('.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＆＃34;数组＆＃34;对于元素，您无法直接在此对象上访问DOM属性。您需要使用[0]（第一个元素）来拉取DOM元素，或者使用jQuery api中的方法，在本例中为.attr()。

此外，如果您要替换$('#gamearea')

，则可能意味着使用$('.gamearea')代替getElementById('gamearea');

Answer 3

.eq()返回一个jQuery对象。如果你想直接使用.src属性，你需要一个DOM元素（不是jQuery对象），你可以使用.get()而不是.eq()这样：

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

我还切换到.find()而不是.children()，以更加等同于您在原始版本中的.getElementsByTagName()，因为您没有向我们展示您的HTML，它似乎是更安全的假设。

Answer 4

我知道这是一个陈旧的答案，但肯定这是一个更好的方法......

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

使用jQuery更改图像src

4 个答案: