sélecteur de base jQuery

DébutantsjQuery, afin de mieux apprendre jQuery aujourd'hui, j'ai spécialement résumé mon expérience d'apprentissage et je l'ai publiée pour la partager avec les débutants. résumez principalement les sélecteurs de base de jQuery. Le sélecteur de base de

jQuery est le sélecteur le plus couramment utilisé dans jQuery et est également le sélecteur le plus simple. Il utilise principalement le ID< de l'élément. 🎜>, CLASS, balise d'élément ELEMENT, etc. pour trouver l'élément DOM dans HTML. Dans une page Web, chaque nom d'ID ne peut être utilisé qu'une seule fois et la classe peut être utilisée à plusieurs reprises. Dans les applications jQury, vous pouvez utiliser ces sélecteurs de base pour effectuer la plupart du travail. Examinons principalement leur processus d'implémentation spécifique. Afin de mieux apprendre, nous listons d'abord un code de balise HTML ici :

<div id="mydiv">
    <div class="mini">我是一个名为mini的div标签</div>
    <div class="mini">我是一个名为mini的div标签</div>
    <div class="mini">我是一个名为mini的div标签</div>
    <p>我是一个段落p标签</p>
    <span>我是一个行内span标签</span>
<div>

1. Sélecteur d'ID

Sélecteur : #id

Description : Correspond à un élément en fonction de l'identifiant donné

Renvoie : Élément unique

Exemple :

<script type="text/javascript">    $(document).ready(function(){
        //id选择器        $("#mydiv").css("background","#f96");
     });</script>

Fonction : Changer l'identifiant en mydiv La couleur d'arrière-plan de l'élément

2. sélecteur de classe

sélecteur : .class

Description : Renvoie les éléments correspondant au nom de classe donné

Renvoie : Éléments de collection

Exemple :

<script type="text/javascript">    $(document).ready(function(){
        //class选择器        $(".mini").css("background","#f96");
     });</script>

Fonction : Modifier le couleur de fond de tous les éléments avec la classe mini

3. Élément de balise

Sélecteur : élément

Description : Correspond à l'élément

en fonction du nom de l'élément donné. Renvoie : Éléments de la collection

Exemple :

<script type="text/javascript">    $(document).ready(function(){
        //element选择器        $("div").css("background","#f96");
     });</script>

Fonction : Changer la couleur d'arrière-plan de tous les éléments dont le nom d'élément est <div>

Tous les éléments*

Sélecteur. : *

Description : Modifie tous les éléments de balise html correspondants

Valeur de retour : Éléments de la collection

Exemple :

<script type="text/javascript">    $(document).ready(function(){
        //*选择器        $("*").css("background","#f96");
     });</script>

Fonction : Changer la couleur d'arrière-plan de toutes les balises d'éléments HTML

5.

Sélecteur : selector,selector2,...selectorN

Description : Convertir chacun Les éléments correspondants par le sélecteur sont combinés et retournés ensemble

Retour : Ensemble élément

Exemple :

<script type="text/javascript">    $(document).ready(function(){
        //selector1,selector2,...selectorN选择器        $(".mini,p").css("background","#f96");
     });</script>

Fonction : Changer la couleur d'arrière-plan des éléments de classe mini et de paragraphe p