文章目录
  1. 1. 场景
  2. 2. 代码

场景

jquery多css选择器获取指定元素,相信你看到这一定会问一个id就搞定的事干嘛扯这么多,但是某些情况下就很无奈呀,就比如今天一哥们问我,一个元素上面有两个class,要怎么获取这个元素,我第一反应也是扔个id上去多好简单粗暴,结果他回答说,这是修改老项目,html不让动,这就很无奈。

代码

既然使用jquery,那第一反应就是符合属性选择器喽~

1
[selector1][selector2][selectorN]

复合属性选择器,需要同时满足多个条件时使用。

比如说我们要用复合属性选择器筛选下面这个元素:

1
<div class="header nav"></div>

我们就可以用下面这种方法去匹配:

1
$(".header.nav")

之后我又想也可以[attribute=value] 去匹配呀:

1
$("[class='header nav']")

jQuery还提供了filter()呀,so:

1
$(".header").filter("nav").prevObject

实际上第一种复合属性选择器的用处远不止上面那么简单,我们也可以像如下去匹配:
比如有很多a标签,但我们只需要class是cur的a标签:

1
$("a.cur")

或者是查找name属性是username的input标签:

1
$("input[name='username']")

那么再加上css里面的伪类,获取所有未选中的 input 元素:

1
$("input:not(:checked)")

也就是复合属性选择器可以使用element/.class/[attribute]等多种选择器去任意组合出你想要的模式。

文章目录
  1. 1. 场景
  2. 2. 代码