JQuery中常用的选择器

JQuery是一款非常流行的JavaScript库，它提供了丰富的选择器来选择页面上的元素，本文将详细介绍JQuery中常用的选择器。

1. 基本选择器

基本选择器是最基本的选择器，可以用于选择单个元素：

- 标签选择器：$("tagname")，选择指定标签名称的元素，如`$("div")`可以选择页面上所有的div元素。

- 类选择器：$(".classname")，选择具有指定类名的元素，如`$(".header")`可以选择所有class属性为header的元素。

- ID选择器：$("#idname")，选择具有指定ID的元素，如`$("#page")`可以选择ID为page的元素。

- 通配符选择器：$("*")，选择所有的元素。

2. 层次选择器

层次选择器可以选择父元素、子元素等关系：

- 后代选择器：$("ancestor descendant")，选择ancestor元素的所有后代元素中符合条件的元素，如`$("ul li")`可以选择所有ul下的li元素。

- 子元素选择器：$("parent > child")，选择parent元素的直接子元素中符合条件的元素，如`$("ul > li")`可以选择ul下的直接子元素li元素。

- 相邻兄弟选择器：$("prev + next")，选择prev元素后相邻的符合条件的next元素，如`$(".prev + p")`可以选择class属性为prev的元素后紧邻着的p元素。

- 兄弟选择器：$("prev ~ siblings")，选择prev元素后所有的符合条件的siblings元素，如`$(".prev ~ p")`可以选择class属性为prev元素后所有的p元素。

3. 过滤选择器

过滤选择器可以选择符合条件的元素：

- :first：选择第一个符合条件的元素，如`$("div:first")`可以选择页面上第一个div元素。

- :last：选择最后一个符合条件的元素。

- :eq(index)：选择指定索引位置的元素，如`$("ul li:eq(2)")`可以选择ul元素下索引为2的li元素。

- :even：选择偶数位置的元素，如`$("ul li:even")`可以选择ul元素下位置为偶数的li元素。

- :odd：选择奇数位置的元素。

- :gt(index)：选择索引大于指定值的元素，如`$("p:gt(2)")`可以选择索引值大于2的p元素。

- :lt(index)：选择索引小于指定值的元素。

- :not(selector)：选择不符合指定选择器的元素，如`$("div:not(.header)")`可以选择不含有class属性为header的div元素。

4. 内容过滤选择器

内容过滤选择器可以根据元素的内容选择元素：

- :contains(text)：选择包含指定文本内容的元素，如`$("p:contains('hello')")`可以选择包含hello文本的p元素。

- :empty：选择没有子元素或文本内容的元素。

- :has(selector)：选择包含符合指定选择器的元素的元素，如`$("ul:has(li)")`可以选择包含li元素的ul元素。

- :parent：选择含有子元素或文本内容的元素。

5. 可见性过滤选择器

可见性过滤选择器可以根据元素的可见性选择元素：

- :visible：选择可见的元素。

- :hidden：选择隐藏的元素。

6. 属性过滤选择器

属性过滤选择器可以根据元素的属性选择元素：

- [attribute=value]：选择含有指定属性值的元素，如`$("a[href='#']")`可以选择含有href属性值为#的a元素。

- [attribute!=value]：选择不含有指定属性值的元素，与:not(selector)相同。

- [attribute^=value]：选择属性值以指定文本开头的元素，如`$("img[src^='http']")`可以选择src属性值以http开头的img元素。

- [attribute$=value]：选择属性值以指定文本结尾的元素。

- [attribute*=value]：选择属性值中包含指定文本的元素。

以上就是JQuery中常用的选择器，使用这些选择器可以更方便地进行元素选择和操作。下面是示例代码：

```html

一个span元素

• 第一个li元素
• 第二个li元素
• 第三个li元素

这是一段包含hello文本的段落

一个链接

```

在上面的例子中，我们使用了各种选择器对页面元素进行了选择和修改样式的操作，同时还绑定了单击事件对元素进行选择状态的切换。

壹涵网络我们是一家专注于网站建设、企业营销、网站关键词排名、AI内容生成、新媒体营销和短视频营销等业务的公司。我们拥有一支优秀的团队，专门致力于为客户提供优质的服务。

我们致力于为客户提供一站式的互联网营销服务，帮助客户在激烈的市场竞争中获得更大的优势和发展机会！