Cas d'utilisation du sélecteur jQuery :lt(index)-js tutoriel-php.cn

Cas d'utilisation du sélecteur jQuery :lt(index)

黄舟

Libérer： 2017-06-23 10:40:25

original

1484 Les gens l'ont consulté

L'exemple de cet article décrit l'utilisation du sélecteur :lt dans jQuery. Partagez-le avec tout le monde pour votre référence. L'analyse spécifique est la suivante :

Ce sélecteur correspond à tous les éléments qui sont inférieurs à la valeur index donnée.
La valeur minimale de l'indice commence à 0.

Structure grammaticale :

$(":lt(index)")

Copier après la connexion

Ce sélecteur est généralement utilisé en conjonction avec d'autres sélecteurs, tels que le sélecteur de classe et le sélecteur d'élémentAttendez.
Par exemple :

$("li:lt(3)").css("color","blue")

Copier après la connexion

Le code ci-dessus peut définir la couleur de la police dans l'élément li avec un indice inférieur à 3 sur le bleu.
S'il n'est pas utilisé avec d'autres sélecteurs, l'état par défaut doit être utilisé avec le sélecteur *, par exemple, $(":lt") est équivalent à $("*:lt").

Liste des paramètres :

Description du paramètre

index La valeur d'index donnée.

Exemple de code :

Exemple 1 :












  html专区
  div+css专区
  jQuery专区
  Javascript专区

Copier après la connexion

Le code ci-dessus peut définir la couleur de police de l'élément li dans la collection d'éléments li avec une valeur d'index inférieure à 3 à la couleur bleue.

Exemple 2 :

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title></title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){ 
  $("#btn").click(function(){ 
    $("*").each(function(){ 
      alert(this.tagName); 
    })         
  }) 
  $("#show").click(function(){ 
    $(":lt(11)").css("border","1px solid red"); 
  }) 
}); 
</script>
</head>
<body>
<ul>
  <li>html专区</li>
  <li>div+css专区</li>
  <li>jQuery专区</li>
  <li>Javascript专区</li>
</ul>
<button id="btn">遍历所有元素</button>
<button id="show">点击查看选择器效果</button>
</body>
</html>

Copier après la connexion

Étant donné que le code ci-dessus ne spécifie pas de sélecteur à utiliser avec le sélecteur :lt, il est utilisé avec le sélecteur * par défaut, donc le code ci-dessus can Définit la couleur de bordure de tous les éléments du document actuel avec une valeur d'index inférieure à 11 sur rouge.

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!