複製圖像的錨標記具有相同的圖像SRC

Question

圖像我有一個列表項

<ul class="listWithAnchors"> 
    <li><a href="/link1"><img src="/path1.jpg" /></a></li> 
    <li><a href="/link2"><img src="/path2.jpg" /></a></li> 
    <li><a href="/link3"><img src="/path3.jpg" /></a></li> 
<ul> 

<ul class="listWithoutAnchors"> 
    <li><img src="/path2.jpg" /></li> 
    <li><img src="/path1.jpg" /></li> 
    <li><img src="/path3.jpg" /></li> 
<ul> 

我想使用jQuery包裹在具有匹配的src路徑的錨標記的圖像。所以最終的結果應該是這樣的：

<ul class="listWithoutAnchors"> 
    <li><a href="/link2"><img src="/path2.jpg" /></a></li> 
    <li><a href="/link1"><img src="/path1.jpg" /></a></li> 
    <li><a href="/link3"><img src="/path3.jpg" /></a></li> 
<ul> 

Answer 1

我在想這樣的事情是你在找什麼？

首先，我們通過瀏覽列表中的每個列表元素並使用錨點將組合錨點URL和圖像src存儲在數組中。然後我們循環訪問另一個列表，並將每個列表項的圖像的src與我們的數組進行比較，如果匹配，我們將URL也存儲在發生src匹配的對象中。

$(document).ready(function(){ 
    var someArray = new array() 
    $(".listWithAnchors li a").each(function(i){ 
     var link = $(this).attr('href'); 
     var src = $("a",this).attr('src'); 
     someArray.push({"l":link,"s":src}); 
    }); 

    $(".listWithoutAnchors li").each(function(i){ 
     var othersrc = $("img",this).attr('src'); 
     for(var j=0;j<someArray.length;j++){ 
      if(someArray[j]["s"] == othersrc){ 
       $(this).html("<a href='"+someArray[j]["l"]+"'>"+$(this).html()+"</a>"); 
      } 
     } 
    } 
});