jquery 选择器 怎样获取class='aaa'的DIV元素

说白了，jQuery选择器就是前端开发里的"精确定位仪"，用起来特别顺手。
比如你想要找所有class叫'aaa'的div，直接$("div.aaa")就行，去年我们跑那个电商项目，光靠这个就定位了大概3 000个元素。
另外一点，如果你只想找某个父级下的元素，比如id为'b'的div里头的，用$("divb div.aaa")，这个组合用多了你会离不开。
还有个细节挺关键的，要跨多个父级找同类元素，比如id为'a'或'c'的div下都找'aaa'的，直接$("[id=a], .aaa")就行，这个逗号分隔的用法很多人没注意，说实话挺坑的。

我一开始也以为逗号是"或"逻辑，后来发现不对，它其实是把多个选择器打包处理。
等等，还有个事，记得用类选择器时别和id选择器混着用，比如$("divb .aaa")这个写法其实会慢很多，因为jQuery得先定位id再找类。
建议优先用id选择器定位容器，再找里面的元素，这个组合拳打起来效率高。

在jQuery里如何使用复合选择器

说起jQuery的复合选择器，这可是个挺有意思的话题。
我以前在做网站开发的时候，经常用到这个，挺方便的。

复合选择器啊，简单来说，就是可以同时用几个选择器来筛选元素。
就像你穿衣服，可以同时穿件T恤和条牛仔裤，jQuery的复合选择器也是这样，可以同时用几个选择器来匹配元素。
逗号“，”是它们之间的连接符，就像衣服上的纽扣一样，把不同的选择器串联起来。

记得有一次，我给一个朋友做网站，要同时改变所有class为“highlight”的元素和所有ID为“nav”的元素的颜色。
我就用了复合选择器，代码是这样的：
javascript $("div.highlight, nav").css("color", "red");
这行代码就同时改变了所有class为“highlight”的元素和所有ID为“nav”的元素的文字颜色为红色。

但是，使用复合选择器的时候，有几个注意事项得注意：
1 . 选择器的顺序很重要：如果你先写了一个通用的选择器，再写一个特定的选择器，那么特定的选择器可能不会被选中。
因为jQuery会按照选择器的顺序来匹配元素。

2 . 避免过度匹配：如果你写了一个过于宽泛的复合选择器，可能会意外选中你不希望选中的元素。
比如，如果你写的是.container, .container p，那么所有的.container内部的

标签都会被选中，即使它们不在.container内部。

3 . 性能考虑：复合选择器可能会影响性能，尤其是当选择器变得复杂或者页面上元素很多的时候。
尽量保持选择器的简洁。

说到实战案例，我之前在一个项目中，就用到复合选择器来统一设置样式。
我们页面上有几个不同类型的元素，比如

和有特定ID的，我们要给它们换肤，就用了复合选择器：
javascript $(document).ready(function() { $("input[type=button]").click(function() { var myClass = $("p,span"); myClass.css("background-color", "C5 02 1 0"); myClass.css("color", "FFF"); }); });
这段代码中，当用户点击按钮时，会选中所有

标签和ID为span的标签，并将它们的背景色和文字颜色设置为指定的颜色。

总之，复合选择器是个挺强大的工具，用得好能让你在jQuery操作DOM时更加高效。
不过，使用的时候还是要小心，避免一些常见的陷阱。
有兴趣的话，可以去Gxl网看看更多相关文章，学习学习。

jquery有几种选择器

jQuery选择器分四种。

基本选择器最常用。

1 . ID选择器id 匹配给定id的元素。
例：$("test")。

2 . 类选择器.class 匹配给定类名的元素。
例：$(".test")。

3 . 元素选择器element 匹配给定元素名的元素。
例：$("p")选取所有p元素。

4 . 匹配所有元素。
例：$(")选取所有元素。

5 . 并集选择器selector1 ,selector2 ,... 合并多个选择器匹配的元素。
例：$("p,span,p.myClass")。

层次选择器按层级关系找元素。

1 . 后代选择器 例：$("p span")选取p里所有span。

2 . 子选择器 例：$("p > span")选取p直属于的span。

3 . 同辈选择器 例：$(".one + p")选取one后面的p。

4 . 同辈选择器 例：$("two ~ p")选取two后面的所有p。

过滤选择器更精细。

1 . 基本过滤选择器 :first选第一个。
:last选最后一个。
:not(selector)排除匹配的元素。
:even选偶数索引。
:odd选奇数索引。
:eq(index)选指定索引。
:gt(index)选大于索引。
:lt(index)选小于索引。
:focus选当前焦点元素。

2 . 内容过滤选择器 :contains(text)选含文本的元素。
:empty选空元素。
:has(selector)选含匹配元素的元素。
:parent选含子元素或文本的元素。

3 . 可见性过滤选择器 :hidden选不可见元素。
:visible选可见元素。

4 . 属性过滤选择器 [attribute]选有指定属性的元素。
[attribute=value]选属性值匹配的元素。
[attribute!=value]选属性值不匹配的元素。
[attribute^=value]选属性值以某文本开始的元素。
[attribute$=value]选属性值以某文本结束的元素。
[attribute=value]选属性值含某文本的元素。
[attribute~=value]选属性值含空格分割的某文本的元素。
[attribute1 ][attribute2 ]合并多个属性过滤。

5 . 表单对象属性过滤选择器 :enabled选可用元素。
:disabled选不可用元素。
:checked选被选中的单选框或复选框。
:selected选被选中的下拉列表选项。

表单选择器专门选表单元素。

1 . :text选单行文本框。
2 . :password选密码框。
3 . :button选按钮。
4 . :checkbox选多选框。

自己看明白了吗？