jQuery的选择器

jQuery的选择器有四种,基本选择器,层级选择器,过滤选择器,筛选选择器(方法)

一、基础选择器:1.ID选择器:$('#id')  2.类选择器:$('class')  3.标签选择器:$('div')  4.并集选择器:$('div,p,li')  5.交集选择器:$('div.redClass')

二、层级选择器:1.子代选择器:$('ul>li')  2.后代选择器:$('ul li')

三、过滤选择器(这类选择器都带有冒号):1.$(li:eq(2)')获取到的li元素中,选择索引号为2的元素,索引号index从0开始。  2.$('li:odd')获取到的li元素中,选择索引号为奇数的元素  3.$('li:even')获取到的li元素中,选择索引号为偶数的元素

四、筛选选择器:

1、children():不加参数是获取所有的子元素,加了参数是获取指定子元素

    console.log($('ul').children())

    console.log($('ul').children('li'))

    console.log($('ul').children('p'))

2、find():必须加参数,获取指定的后代元素

    console.log($('ul').find('li'))

    console.log($('ul').find('ol'))

3、siblings():查找兄弟节点,不包括自身

    console.log($('#ulLi5').siblings())

    console.log($('#ulLi5').siblings('li'))

4、parent():父元素节点/parents():祖先元素所有元素节点

    console.log($('#ulLi5').parent())

    console.log($('#ulLi5').parents())

5、eq(index):同层级选择器的eq

    console.log(jQuery('ul>li').eq(4))

    console.log(jQuery('ul>li:eq(4)'))

6、next():查找下一个兄弟

    console.log($('#ulLi5').next())

7、prev():查找上一个兄弟

      console.log($('#ulLi5').prev())

8、index():返回指定元素相对于其他统计元素的index(索引)位置

    console.log($('#Li5').index())

9、not() :返回指定元素之外的元素。

    console.log($('ul').children().not('li'))

  • 3
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值