zoukankan      html  css  js  c++  java
  • 选中多个<ul>中的第一个<li>方法

    获取第一个ul中的第一个li标签的方法:

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

    选中如下代码中的各个ul中的第一个li标签

    <body>
    <ul>
      <li>第一个</li>
      <li>第二个</li>
      <li>第三个</li>
    </ul>
    <ul>
      <li>第一个</li>
      <li>第二个</li>
      <li>第三个</li>
    </ul>
    <ul>
      <li>第一个</li>
      <li>第二个</li>
      <li>第三个</li>
    </ul>
    </body>

    共有四种方案:

    方案一:

    $(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");
    });

    效果如下代码:

  • 相关阅读:
    iBatis的基本使用
    修改浏览器语言环境
    JavaScript实现级联下拉框
    Spring2.5与JDK8的集成问题
    JDK API文档下载
    C程序:年转化天
    线程基础
    拷贝控制之拷贝、赋值、销毁
    jquery中attr、prop、data
    input 类型为number型时,maxlength不生效?
  • 原文地址:https://www.cnblogs.com/ckwblogs/p/6052597.html
Copyright © 2011-2022 走看看