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

范范

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

范范

上述内容可以看出，  :last-child  :first-child  获取的都是一个list   就是符合条件的每个  a  的子元素的最后一个 或者第一个

范范

:last   :first   获取的都是一个单一的元素   就是获取匹配的所有a下的最后一个  或者第一个子元素