Question

我有以下问题。在加载时我想使用每个使用“.image”类遍历所有div，获取该div中的图像源并替换相应列表项的源。

下面的示例：useThis1将替换item1的源，useThis2将替换item2的源，依此类推。对此有任何帮助将非常感激。

<div class="image"><img src="useThis1"/></div>
<div class="image"><img src="useThis2"/></div>
<div class="image"><img src="useThis3"/></div>
<div class="image"><img src="useThis4"/></div>
<div class="image"><img src="useThis5"/></div>

<div id="contentA">
<ul>
<li><img id="item1" src="toReplaceThis"></li>
<li><img id="item2" src="toReplaceThis"></li>
<li><img id="item3" src="toReplaceThis"></li>
<li><img id="item4" src="toReplaceThis"></li>
<li><img id="item5" src="toReplaceThis"></li>
</ul>
</div>

Answer 1

var dvImages = $('.image img');  //array of usethis images
var liImages = $('#contentA img'); //array of item images

$.each(dvImages, function(index){
    if(index == liImages.length)
        return false;
    $(liImages[index]).attr('src', $(this).attr('src'));
});

如果要在DOM完全加载时执行该函数，请将函数包装在$(document).ready()中。

Answer 2

$('.image img').each(function(i){
   $('#contentA').find('li:eq('+i+') img').attr('src', $(this).attr('src'));
});

使用jQuery来替换图像源

2 个答案: