images de copie d'étiquette d'ancrage aux images qui ont la même image SRC

Question

J'ai un élément de la liste

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

Je voudrais utiliser jQuery pour envelopper les images dans les balises d'ancrage qui ont correspondant à des chemins src. Donc, le résultat final devrait ressembler à ceci:

<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

Je pense que quelque chose comme ceci est ce que vous cherchez?

Tout d'abord, nous stockons l'URL d'ancrage combinée et l'image src dans un tableau en passant par chaque élément de liste dans la liste avec des ancres. Ensuite, nous parcourons l'autre liste et comparons le src de l'image de chaque élément de la liste à notre tableau et s'il y a correspondance, nous prenons l'URL également stockée dans cet objet où la correspondance src s'est produite.

$(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>"); 
      } 
     } 
    } 
});