苏飞论坛

 找回密码
 马上注册

QQ登录

只需一步,快速开始

扫一扫,访问微社区

分布式系统框架(V1.3) 轻松承载百亿数据,千万流量!讨论专区 - 源码下载 - 官方教程

HttpHelper万能框架(V2.3) HttpHelper官方出品,无敌框架讨论区 - 源码下载 - 在线测试和代码生成

HttpHelper爬虫类(V1.9) 最牛的爬虫类,没有爬不到只有想不到 源码 - 代码生成器 - 讨论区 - 教程- 例子

查看: 1995|回复: 2

[Jquery] jQuery获取每个父元素的最后一个子元素方法

[复制链接]
  • TA的每日心情
    奋斗
    昨天 08:44
  • 签到天数: 199 天

    [LV.7]常住居民III

    发表于 2018-3-12 21:31:42 | 显示全部楼层 |阅读模式
    :last-child 子元素选择器,释义如下:
       匹配最后一个子元素,为每个父元素,匹配最后一个子元素


    与之前讲解的 :first-child  相反, :firt-child 匹配每一个父元素的第一个子元素


    而:last 选择器,是只匹配最后一个元素

    以下是几种选择器的比较内容,可以根据输出结果,对选择器 :last-child  :first-child   :last  进行比较
    具体实例如下:
    html代码:
    [HTML] 纯文本查看 复制代码
    <ul>
      <li>John</li>
      <li>Karl</li>
      <li>Brandon</li>
    </ul>
    <ul>
      <li>Glen</li>
      <li>Tane</li>
      <li>Ralph</li>
    </ul>


    在每个ul中查找最后一个li
    :last-child jQuery代码如下:
    [JavaScript] 纯文本查看 复制代码
    $("ul li:last-child")


    输出代码如下:
    [JavaScript] 纯文本查看 复制代码
    [ <li>Brandon</li>, <li>Ralph</li> ]



    在每个ul中 查找第一个li
    :first-child jQuery代码如下:
    [JavaScript] 纯文本查看 复制代码
    $("ul li:first-child")


    输出代码如下:
    [JavaScript] 纯文本查看 复制代码
    [ <li>John</li>, <li>Glen</li> ]



    在所有ul中,查找最后一个li
    :last jQuery代码如下:
    [JavaScript] 纯文本查看 复制代码
    $("ul li:last")


    输出代码如下:
    [JavaScript] 纯文本查看 复制代码
    [ <li>Ralph</li> ]





  • TA的每日心情
    奋斗
    昨天 08:44
  • 签到天数: 199 天

    [LV.7]常住居民III

     楼主| 发表于 2018-3-12 22:21:19 | 显示全部楼层
    上述内容可以看出,  :last-child  :first-child  获取的都是一个list   就是符合条件的每个  a  的子元素的最后一个 或者第一个
  • TA的每日心情
    奋斗
    昨天 08:44
  • 签到天数: 199 天

    [LV.7]常住居民III

     楼主| 发表于 2018-3-12 22:22:00 | 显示全部楼层
    :last   :first   获取的都是一个单一的元素   就是获取匹配的所有a下的最后一个  或者第一个子元素
    您需要登录后才可以回帖 登录 | 马上注册

    本版积分规则

    QQ|手机版|小黑屋|手机版|联系我们|关于我们|广告合作|苏飞论坛 ( 豫ICP备17001017号-1 )

    GMT+8, 2018-12-13 07:15

    © 2017-2018

    快速回复 返回顶部 返回列表