Javascript 使用jQuery中的.attr（）更改div中的图像src

我想使用

jQuery

更改

HTML

中的所有图像源

我有以下部门：

<div id="image_list">

    <a href="images/Image1.jpg" title="Image 1">
        <img class="img" src="images/Image1.jpg" alt="Image 1">
    </a>

    <a href="images/Image2.gif" title="Image 2">
        <img class="img" src="images/Image2.gif" alt="Image 2">
    </a>
    <a href="images/Image3.gif" title="Image 3">
        <img class="img" src="images/Image3.gif" alt="Image 3">
    </a>

    <a href="images/Image4.gif" title="Image 4">
        <img class="img" src="images/Image4.gif" alt="Image 4">
    </a>

    <a href="images/Image5.gif" title="Image 5">
        <img class="img" src="images/Image5.gif" alt="Image 5">
    </a>

</div>

我使用jQuery函数在加载文档2秒后更改div中的所有图像：

setTimeout(function () {
    for (var i = 0; i < links.length; i++) {
        alert("DFDF");
        $(this).find("img").attr('src', 'images/back.jpg');

    }

}, 2000);

setTimeout（函数（）{
对于（变量i=0；i

links是

a

标记

links=$listNode.find（'a'），

而

$listNode

是

$listNode=$（“#图像_列表”）

该功能正在警告DFDF，但不会更改图像源

我的代码有什么问题

---

谢谢。

for

不会设置

此

，因此

$（此）

指的是全局

窗口

对象，而不是迭代的当前元素。使用

。每个
：

links.each(function() {
    alert("DFDF");
    $(this).find("img").attr('src', 'images/back.jpg');
});

但您根本不需要迭代，因为jQuery修饰符函数将对集合进行操作：

links.find("img").attr('src', 'images/back.jpg');

您不需要迭代每个元素，jquery将为您做到这一点：

setTimeout(function () {
        $('#image_list img').attr('src', 'images/back.jpg');
}, 2000);

顺便说一句，我怀疑
这个
是否意味着您认为它在上面的代码中的含义。
使用选择器，您不需要迭代

setTimeout(function(){
    $("#image_list img").attr("src","images/back.jpg");
},2000);

您可以选择
image\u列表中的所有
img
标签，如下所示：

$("#image_list img")

$('#image_list img').attr('src', 'images/back.jpg')

只需扩展它即可更改所有选定元素的
src
属性，如下所示：

$("#image_list img")

$('#image_list img').attr('src', 'images/back.jpg')

使用IIFE（立即调用的函数表达式），如下所示，在页面加载后每2秒更改一次图像的src：

$(function() {
    $('#image_list .img').each(function(i,img) {
        var tm = i * 2000;
        (function( time, image ) {
            setTimeout(function() {
                $(image).attr('src', 'images/back.jpg');
            }, time );
        })( tm, img );
    });
});


$（函数（）{
var imgsrc=http://aspnethosting2go.com/wp-content/uploads/2014/07/feature1.png';
$（'#image_list.img'）。每个（函数（i，img）{
var tm=i*2000；
（功能（时间、img）{
setTimeout（函数（）{
$（img）.attr（'src'，imgsrc）.css（'width'，'100px'）；
}，时间）；
})（tm，img）；
});
});

此
是指setTimeout（）回调中的
窗口
尝试
$（'img'）。每个（函数（）{this.src='1.png'；}）
如果您想更改所有图像源。@RayonDabre小心，src属性需要一个绝对路径（不确定如何跨浏览器处理setter）@A.Wolff，
src
返回绝对路径，您可以设置相对路径的源。.我已经测试过了。.如果我错了，请纠正我@我认为你是对的，但我不确定；）这会将页面上的每个图像设置为back.jpg。这不是Op想要做的，请不要只是将代码作为答案转储。如果没有解释，这是一个糟糕的答案。我正在编辑我的答案。在解释之前，我无意中发布了代码。看起来他确实需要迭代才能达到要求：……在加载文档2秒后更改div中的所有图像。@PeterKA
.attr（）
自动迭代。你说得对，我可能对2秒部分读得太多了。它听起来像是每2秒一幅图像。确切地说，我想这是数组中的元素而不是窗口，谢谢你的帮助