javascript - 更改图像标签列表的图像源并将其替换为特定列表

Question

我需要替换 div 标签中的图像 src 列表。例如 ：

<!-- language-all: lang-html -->  
<div id="Listofimages">
    <img src="images\2page_img_3.jpg">
    <img src="images\2page_img_3.jpg">
    <img src="images\2page_img_3.jpg">
</div>

所以在这里我想更改这 3 个图像源。

Answer 1

你可以这样做：

$('#Listofimages img').eq(0).attr('src', 'new_image_1');
$('#Listofimages img').eq(1).attr('src', 'new_image_2');
$('#Listofimages img').eq(2).attr('src', 'new_image_3');

Answer 2

另一个演示 http://jsfiddle.net/ac52D/

好读：http ://api.jquery.com/prop/

小解释：

下面的代码使用 id获取所有img标签并更改其 img src。divListofimages

该演示包含之前和之后的警报。

希望这可以帮助，

代码

var src = "google.com";
$('#Listofimages img').each(function(){
         alert("IMG Source before change => " + $(this).prop('src'));
         $(this).prop('src', src);
        alert("IMG Source After change => " + $(this).prop('src'));
    }
);​

HTML

 <div id="Listofimages">
     <img src="images\2page_img_3.jpg"/>
     <img src="images\2page_img_3.jpg"/>
     <img src="images\2page_img_3.jpg"/>
</div>

​</p>

Answer 3

你可以像下面这样轻松地做到这一点：

你的 HTML

<div id="Listofimages">
    <img src="images\2page_img_3.jpg">
    <img src="images\2page_img_3.jpg">
    <img src="images\2page_img_3.jpg">
</div>

jQuery代码

var url = 'http://assets.techdreams.org/wp-content/uploads/2009/09/GoogleChromeLogo1.png';
$('#Listofimages img').prop('src', function(index, oldSource) {
    return url;
});

演示

.prop()接受第二个参数作为函数，该函数的参数分别是index和oldValue。