sélecteur jQuery aide

Question

J'ai un grand document HTML qui a à peu près cette structure:

<div id="a"> 
    <!-- more html code here --> 
    <span id="title">...</span> 
    <!-- more html code here --> 
</div> 
<div id="b"> 
    <!-- more html code here --> 
    <span id="title">...</span> 
    <!-- more html code here --> 
</div> 
... 
... 
<div id="z"> 
    <!-- more html code here --> 
    <span id="title">...</span> 
    <!-- more html code here --> 
</div>  

Notez que les DIVs externes ont des ID qui sont uniques ("a", "b", ..., « z "), mais les SPAN internes ont des ID qui ne sont pas uniques (" title ").

Pour sélectionner un SPAN qui se trouve dans la DIV « q », par exemple, j'ai essayé d'utiliser ceci:

$("#q").find("#title"); 

Cela va vite sur FF et Chrome, mais la méthode find() prend beaucoup de temps à exécuter dans IE8 (et IE7). Y a-t-il un autre moyen de le faire?

S'il vous plaît laissez-moi savoir si je peux fournir des informations supplémentaires.

Answer 1

Vous devez modifier votre balisage pour utiliser des classes pour les éléments <span> au lieu des ID, car les ID doivent être uniques.

<div id="a"> 
    <!-- more html code here --> 
    <span class="title">...</span> 
    <!-- more html code here --> 
</div> 
<div id="b"> 
    <!-- more html code here --> 
    <span class="title">...</span> 
    <!-- more html code here --> 
</div> 
... 
... 
<div id="z"> 
    <!-- more html code here --> 
    <span class="title">...</span> 
    <!-- more html code here --> 
</div> 

alors:

$("#q").find(".title"); 

Si je me souviens bien, en particulier IE a des problèmes avec les ID non uniques. Changer votre code ci-dessus peut faire l'affaire pour vous.

Answer 2

Comme tout le monde l'a dit, le code n'est pas valide. Cependant, si vous êtes bloqué avec, vous devriez être capable de le faire pour le sélectionner correctement. Sans l'exécution des tests, je ne sais pas comment performant, ce sera sur l'autre méthode que vous avez essayé:

$("#b span[id=title]"); 

Answer 3

Que diriez-vous quelque chose comme

$("#q").find("span").each(function() { 
    if($(this).attr("id") == "title") { 
     $(this).css('color','red'); 
    } 
}); 

Cela fonctionne pour moi dans IE/FF