jquery之选择将被操作的元素(通过位置选择)

来源:互联网 发布:知乎2015书单 编辑:程序博客网 时间:2024/06/11 10:02

jquery之选择将被操作的元素(通过位置选择)

----------

 

有时候,必须根据元素在页面上的位置或者与其他元素的关系去选择元素。也许你想要选择页面上的第一个链接、奇数或偶数的段落,或者每个列表的最后一项。jquery支持实现过些具体选择的机制。

例如,思考:

a:first

此格式的选择器匹配页面上的第一个<a>元素。

怎样选择序数为偶数(或奇数)的元素呢?

p:odd

这个选择器匹配所有序数为奇数的段落元素。当然,也可以选择序数为偶数的元素

p:even

另一种形式:

li:last-child

选择父元素的最后子节点。

 

jquery支持的位置选择器:根据在DOM里的位置来选择元素

选择器                       描述

:first                       页面的最先的匹配。如:li a:first返回最先的,并且在列表(<li>)项下的链接

:last                        页面的最后的匹配。如:li a:last返回最后的,并且在列表(<li>)项下的链接

:first-child                 最先的子元素。如:li:first-child返回每个列表的最先的项

:last-child                  最后的子元素。如:li:last-child返回每个列表的最后的项

:only-child                  如果某个元素是父元素中唯一的子元素,那将会被匹配

:nth-child(n)                第n个子节点(n从1开始)如:li:nth-child(2)返回每个列表的第2个<li>项

:nth-child(even|odd)        偶数或奇数子节点,如:li:nth-child(even)返回每个序列的偶数子节点

:nth-child(Xn+Y)             根据传入的公式计算的第n个子节点。如果Y为0,则忽略Y。n从0开始,且Y不等于0

                             。如:li:nth-child(3n)返回3的倍数的项,而li:nth-child(5n+1)返回5的倍数的项的下一项。

:even或:odd                  页面范围内偶数或奇数的匹配元素。如:li:even返回全部偶数<li>项

:eq(n)                       第n个匹配元素(n从0开始)

:gt(n)                       第n个匹配元素(不包括)之后的元素(n从0开始)

:lt(n)                       第n个匹配元素(不包括)之前的元素(n从0开始)

 

选择器nth-child从1开始计数,而其他选择器从0开始计数。为了与CSS兼容,nth-child从1开始计数,但是jquery自定义的选择器遵循更为常见的从0开始的编程惯例。

 

原创粉丝点击