jQuery : Explication détaillée de l'utilisation du sélecteur gt(index)-js tutoriel-php.cn

jQuery : Explication détaillée de l'utilisation du sélecteur gt(index)

黄舟

Libérer： 2017-06-23 10:14:09

original

1464 Les gens l'ont consulté

Il y a un sélecteur dans jQuery : $(“:gt(index)”) .

l'index commence à 0

signifie sélectionner des éléments supérieurs à l'index

Par exemple : $("tr:gt(2)"),

signifie Sélectionnez

à partir du 4ème élément tr. Laissez-moi vous donner un exemple :

 <!DOCTYPE html><html>
    <head>
        <meta charset="UTF-8">
        <title></title>
                <style type="text/css">
            p{                float: left;                width: 30px;                border: 1px solid;            }
        </style>
        <script src="jquery-1.12.3.min.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
        <p class="demo">123</p>
        <p class="demo">123</p>
        <p class="demo">123</p>
        <p class="demo">123</p>
        <p class="demo">123</p>
        <p class="demo">123</p>
        <p class="demo">123</p>
        <p class="demo">123</p>
        <p class="demo">123</p>
        <p class="demo">123</p>
    </body>
        <script type="text/javascript">
            $(".demo:gt(2)").css("color","red");        </script></html>

Copier après la connexion

Le résultat est qu'à partir de la quatrième balise p, le contenu est rouge. l'index commence à 0.

Regardez l'effet

jQuery : Explication détaillée de lutilisation du sélecteur gt(index)

Cette méthode sélectionne tous les éléments qui correspondent à une valeur supérieure à l'index spécifié : la valeur de l'index commence en comptant à partir de 0

<!DOCTYPE html>
<html>
<head>
<title>Insert you title</title>
<meta http-equiv=&#39;description&#39; content=&#39;this is my page&#39;>
<meta http-equiv=&#39;keywords&#39; content=&#39;keyword1,keyword2,keyword3&#39;>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type=&#39;text/javascript&#39; src=&#39;./js/jquery-1.12.1.min.js&#39;></script>
<script type=&#39;text/javascript&#39;>
    $(function(){
       var size = $(&#39;#list li:gt(3)&#39;).size();
       alert(size);
    });    
</script>
</head>
<body>
    <ul id=&#39;list&#39;>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</body>
</html>

Copier après la connexion

Aperçu

Correspond à tous les éléments supérieurs à la valeur d'index donnée

Paramètres

indexNumberV1.0

Commencez à compter à partir de 0

Exemple

Description :

Trouvez les deuxième et troisième lignes, c'est-à-dire que les valeurs d'index sont 1 et 2, c'est-à-dire supérieures à 0

Code HTML :

<table> 
<tr>
<td>Header 1</td>
</tr> 
<tr>
<td>Value 1</td>
</tr> 
<tr>
<td>Value 2</td>
</tr> 
</table>

Copier après la connexion

Code jQuery :

$("tr:gt(0)")

Copier après la connexion

Résultat :

[ <tr><td>Value 1</td></tr>, <tr><td>Value 2</td></tr> ]

Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!