Question Comment sélectionner un seul élément dans jQuery?


J'ai une structure de table qui ressemble à:

<table>
 <tr id="row1">
   <td>
     <div>row 1 content1</div>
   </td>
   <td>
     <div>row 1 content2</div>
   </td>
   <td>
     <div>row 1 content3</div>
   </td>
 </tr>
 <tr id="row2">
   <td>
     <div>row 2 content1</div>
   </td>
   <td>
     <div>row 2 content2</div>
   </td>
   <td>
     <div>row 2 content3</div>
   </td>
 </tr>
 <tr id="row3">
   <td>
     <div>row 3 content1</div>
   </td>
   <td>
     <div>row 3 content2</div>
   </td>
   <td>
     <div>row 3 content3</div>
   </td>
 </tr>
</table>

En utilisant jQuery, j'essaie de sélectionner le DIV dans la deuxième cellule de la troisième ligne. J'ai essayé entre autres choses:

var d = $('#row3').children(':eq(1)').children(':eq(0)');

Ce que je récupère est un tableau avec un seul élément (le DIV je suis après) et je dois ensuite accéder en utilisant d [0]. Pourquoi jQuery retourne-t-il un tableau à un seul élément, je pensais que l'utilisation du sélecteur ci-dessus renverrait directement l'élément DIV?


@ Shog9 - Duh ... Ok, une lumière vient de s'allumer dans mon cerveau, je comprends maintenant. À votre santé.


26
2017-11-21 01:10


origine


Réponses:


jQuery renvoie toujours un ensemble d'éléments. Parfois, le jeu est vide. Parfois, il ne contient qu'un élément. La beauté de ceci est que vous pouvez écrire du code pour travailler de la même manière, quel que soit le nombre d'éléments correspondants:

$("selector").each(function()
{
   this.style.backgroundColor = "red";
});

Amusement!


24
2017-11-21 01:14



Si vous préférez garder un objet jQuery, vous pouvez écrire à la place:

$("selector").first().val()

25
2017-07-05 13:35



Si vous trouvez que vous savez que vous ne traitez qu'un seul élément et qu'un seul élément sera renvoyé, vous pouvez toujours sélectionner l'index zéro du tableau.

$("selector")[0].value 

C'est sale et brise la convention de jQuery en général ... mais vous "pourriez" le faire.


8
2018-06-07 17:34



$ ("sélecteur"). eq (5)

Cela retourne un tableau jquery de première classe avec seulement le 5ème élément. c'est-à-dire que je peux effectuer des fonctions jquery sur la valeur de retour.

Trouvé la réponse ici: https://forum.jquery.com/topic/jquery-class-selectors-referencing-individual-elements 


6
2017-07-21 18:14



Il y a plusieurs options pour cela:

"Sélectionnez le premier de plusieurs éléments Div dans l'extrait ci-dessous et changez sa couleur en rose"

<div>Div 1</div> <div class="highlight">Div 2</div> <div id="third">Div 3</div> <div class="highlight">Div 4</div>

Ici, nous pouvons sélectionner la première division de la manière suivante:

1) $("div").first().css("color","pink"); 
2) $("div:first").css("color","pink"); 
3) $("div:first-of-type").css("color","pink"); 

Veuillez noter que 2 est une construction jQuery et non une structure CSS native et peut donc être légèrement moins performante.


1
2018-04-04 14:53



Pour obtenir directement div, essayez ceci

$divElement = $('#row3 td div');


-1
2017-07-31 09:57