¿Cómo selecciono un solo elemento en jQuery?

Question

que tienen una estructura de tabla que se parece a:

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

Usando jQuery Estoy tratando de seleccionar el DIV en la segunda celda de la tercera fila. He intentado lo siguiente (entre otras cosas):

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

Lo que se obtiene es una matriz con un solo elemento (DIV que busco) y tengo que luego de acceso que utilicen d [0]. ¿Por qué jQuery devuelve una única matriz de elementos, pensé que usar el selector anterior devolvería el elemento DIV directamente?

---

@Shog9 - Duh ... Ok simplemente una luz encendido en mi cerebro, lo entiendo ahora. Aclamaciones.

Answer 1

jQuery siempre devuelve un conjunto de elementos. A veces, el conjunto está vacío. A veces, contiene solo un elemento. La belleza de esto es que se puede escribir código para que funcione de la misma manera, independientemente de cuántos elementos están emparejados:

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

Fun!

Answer 2

Si encuentra que sabe que solo tratará con un solo elemento y que solo se devolverá un elemento, siempre puede seleccionar el índice cero de la matriz.

$("selector")[0].value 

Está sucio y rompe la convención de jQuery en general ... pero usted "podría" hacer esto.

Answer 3

Si prefiere mantener un objeto jQuery, puede escribir en su lugar:

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

Answer 4

$("selector").eq(5)

Esto devuelve una primera matriz jQuery clase con apenas el artículo quinto. es decir, puedo hacer funciones jquery en el valor de retorno.

encontrado la respuesta aquí: https://forum.jquery.com/topic/jquery-class-selectors-referencing-individual-elements

Answer 5

Para obtener div directamente, probar este

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

Answer 6

Hay varias opciones para hacer esto:

", seleccione el primero de varios elementos Div en el siguiente fragmento y cambiar su color a rosa"

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

Aquí podemos seleccionar la primera División de la siguiente manera:

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

Tenga en cuenta que 2 es una construcción jQuery y no una construcción css nativa y, por lo tanto, puede ser un rendimiento ligeramente menor.