Maison > interface Web > js tutoriel > Explication détaillée de quatre solutions pour obtenir le premier positionnement li de jq ul

Explication détaillée de quatre solutions pour obtenir le premier positionnement li de jq ul

高洛峰
Libérer: 2017-01-04 14:23:40
original
1668 Les gens l'ont consulté

Si nous obtenons juste le premier li dans un ul, alors nous pouvons écrire comme ceci :

$("ul li:first");
$("ul li"). 0);
$("ul li").first();
$("ul li").slice(0,1);//Le premier paramètre de slice représente le début de la sélection Position, le deuxième paramètre est la position finale

<ul>
<li>安哲</li>
<li>安哲</li>
<li>安哲</li>
<li>安哲</li>
</ul>
<ul>
<li>安哲</li>
<li>安哲</li>
<li>安哲</li>
<li>安哲</li>
</ul>
<ul>
<li>安哲</li>
<li>安哲</li>
<li>安哲</li>
<li>安哲</li>
</ul>
<ul>
<li>安哲</li>
<li>安哲</li>
<li>安哲</li>
<li>安哲</li>
</ul>
Copier après la connexion

J'ai écrit sur quatre solutions

<script type="text/javascript">
//方案一
$(function(){
var list=$("ul");
for (var i = 0; i < list.length; i++) {
$("ul:eq("+i+") li:first").css("background","red");
 
}
});
//方案二
/*$(function(){
$("ul").each(function(){
$(this).children().first().css("background","red"); 
});
});*/
//方案三
/*$(function(){
$("ul li:nth-child(1)").css("background","red");
});*/
//方案四
/*$(function(){
$("ul li:first-child").css("background","red");
});*/
</script>
Copier après la connexion

Ce qui précède est tout le contenu de cet article, j'espère que c'est utile à tout le monde, merci de soutenir le site Web PHP chinois !

Pour des explications plus détaillées sur l'obtention des quatre solutions pour le premier positionnement li de jq ul, veuillez faire attention au site Web PHP chinois pour les articles connexes !


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal