JQuery 伪类选择器

Html代码:

    <ul>
        <li>one</li>
        <li>two</li>
        <li>three</li>
    </ul>

所有的伪类选择器,都将围绕上面的Html代码。

伪类选择器

第一个节点

$('ul li:first-child') // one

最后一个节点

$('ul li:last-child') // three

第二个节点

通过索引。

$('ul li:eq(1)') // two

通过节点数。

$('ul li:nth-child(2)') // two

第二个节点之后

索引大于0的。

$('ul li:gt(0)') // two three

第二个节点之前

索引小于2的。

$('ul li:lt(2)') // one two

偶数节点

$('ul li:even') // one three

奇数节点

$('ul li:odd') // two

文本匹配

匹配还有o的文本。

$('ul li:contains(o)') // one two

更多:

$(“selector:empty”) //匹配不含子元素或文本的序列

$(“selector:parent”) // 匹配含子元素或文本的序

$(“selector:animate”) //选择动画元素

$(“selector:header”) //选择标题(h1…….hn)

 

posted @ 2020-03-19 20:26  Sun先生  Views(667)  Comments(0Edit  收藏  举报