详解获取jq ul第一个li定位的四种解决方案

如果我们只是获取一个ul中的第一个li的话,那么我们可以这样写:

$("ul li:first");
$("ul li").eq(0);
$("ul li").first();
$("ul li").slice(0,1);//slice第一个参数表示的选取开始的位置,第二个参数是结束的位置

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

  解决方案我大概写了四种

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

    运行结果

以上就是本文的全部内容,希望对大家有所帮助,谢谢对呐喊教程的支持!

声明:本文内容来源于网络,版权归原作者所有,内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:notice#nhooo.com(发邮件时,请将#更换为@)进行举报,并提供相关证据,一经查实,本站将立刻删除涉嫌侵权内容。