Heim  >  Artikel  >  Web-Frontend  >  Detaillierte Erläuterung der vier Lösungen zum Erhalten der ersten li-Positionierung von jq ul

Detaillierte Erläuterung der vier Lösungen zum Erhalten der ersten li-Positionierung von jq ul

高洛峰
高洛峰Original
2017-01-04 14:23:401624Durchsuche

Wenn wir nur das erste li in einem ul bekommen, dann können wir so schreiben:

$("ul li:first");
$("ul li eq(). 0);
$("ul li").first();
$("ul li").slice(0,1);//Der erste Parameter von Slice stellt den Beginn der Auswahl dar Position, Der zweite Parameter ist die Endposition

<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>

Ich habe über vier Lösungen geschrieben

<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>

Das Obige ist der gesamte Inhalt dieses Artikels, ich hoffe, das ist es Hilfreich für alle, vielen Dank für Ihre Unterstützung der chinesischen PHP-Website!

Ausführlichere Erklärungen zum Erhalten der vier Lösungen für die erste Li-Positionierung von jq ul finden Sie auf der chinesischen PHP-Website für verwandte Artikel!


Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn