jquery的选择器有哪些
时间: 2024-08-13 15:04:43 浏览: 61
jQuery 提供了丰富的选择器系统,用于在文档中选取和操作元素。这些选择器可以根据元素的标签名、类名、ID、属性值、CSS样式等多种条件来选择元素。以下是一些主要的jQuery选择器:
1. 标签选择器(Element selectors): `$("tagname")`,如`$("p")`选取所有的`<p>`标签。
2. 类选择器(Class selectors): `.classname`,如`$(".my-class")`选取拥有指定class的元素。
3. ID选择器(ID selectors): `$("#idname")`,如`$("#main-content")`选取具有指定ID的元素。
4. 属性选择器(Attribute selectors): `[attribute]`或`[attribute=value]`,如`$("[href]")`选取所有`href`属性存在或`$("[data-type='image']")`选取"data-type"属性为"image"的元素。
5. 子元素选择器(Child selectors): `parent > child`,如`$("div > p")`选取所有直接位于`<div>`内的`<p>`元素。
6. 相邻兄弟选择器(Adjacent sibling selectors): `element + sibling`,如`$(".item + .item")`选取紧接在`.item`之后的另一个`.item`元素。
7. 通用选择器(Universal selector): `*`,如`$("*")`选取文档中的所有元素。
8. 后代选择器(Descendant selectors): `parent descendant`,如`$("#container div")`选取所有在`#container`下的`<div>`元素。
9. 伪类选择器(Pseudo-class selectors): 如`:hover`, `:focus`, `:first-child`, `:last-child`, 等,用于选择满足特定状态的元素。
10. CSS3选择器(如`:not()`, `:eq()`, `:gt()`, `:lt()`, 等): 可以组合使用以创建更复杂的条件。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)