Selectores de jQuery

El concepto más básico de jQuery es "elegir algunos elementos y realizarles un tratamiento".

Los selectores jQuery le permiten "encontrar" (o seleccionar) elementos HTML en una página web.

jQuery admite la mayoríaCSS3Selectory algunos selectores no estándar.

Todos los selectores en jQuery comienzan con el símbolo de dólar y paréntesis: $().

Selector de elementos

Los selectores de elementos jQuery se pueden usar para seleccionar elementos según el nombre del elemento.

Puede seleccionar todos los<p>elementos, como se muestra a continuación:

$("p")

Cuando el usuario hace clic en el botón, el siguiente código jQuery seleccionará y resaltará todos los<p>Elemento:

$(document).ready(function() {
　　$("button").click(function() {
　　　　$("p").css("background-color", "yellow");
　　});
});

#selector de id

jQuery #idEl selector utiliza el marcado HTMLAtributo idpara encontrar un elemento específico.

El ID del elemento debe ser único en la página, por lo que el selector de ID se utiliza para seleccionar un elemento único.

Para encontrar elementos con un ID específico, escriba un carácter de almohadilla (#) seguido del ID del elemento HTML:

$("#demo")

Cuando el usuario hace clic en el botón, el siguiente código jQuery seleccionará y resaltará el elemento con id="demo":

$(document).ready(function() {
　　$("button").click(function() {
　　　　$("#demo").css("background-color", "yellow");
　　});
});

.selector de clase

jQuery .classEl selector encuentra elementos con un nombre de clase específico.

Para encontrar elementos con una clase específica, escriba un carácter de punto (.) seguido del nombre de la clase:

$(".demo")

Cuando el usuario hace clic en el botón, el siguiente código jQuery seleccionará y resaltará todos los elementos con class="demo":

$(document).ready(function() {
　　$("button").click(function() {
　　　　$(".demo").css("background-color", "yellow");
　　});
});

Selectores múltiples

Puede seleccionar múltiples selectores según sea necesario. Simplemente separe los selectores con comas.

Selector de múltiples selectores selecciona la combinación de resultados de todos los selectores especificados:

$("selector1, "selector2, "selectorN")

El siguiente código jQuery seleccionará cada<h2>，<div>y<span>Elemento:

$(document).ready(function() {
　　$("h2, "div", "span")".css("background-color", "lightgreen");
});

Es muy útil cuando desea realizar la misma operación para diferentes selectores.

Ejemplo de selector jQuery

jQuery ofrece varios métodos para seleccionar elementos HTML específicos.

Referencia de selector de jQuery

Para obtener una referencia completa de los selectores, por favor visite nuestroReferencia de selector de jQuery.