jQuery 选择器是一种强大的工具,允许您对 HTML 元素组或单个元素进行操作。它基于元素的 id、类、类型、属性、属性值等查找(或选择)HTML 元素。除了基于现有的 CSS 选择器外,jQuery 还提供了一些自定义的选择器。
在 jQuery 中,所有选择器都以美元符号($)开头。以下是一些常见的选择器:
1. 元素选择器:基于元素名选取元素。例如,要选取页面中的所有 `
` 元素,可以使用以下代码:
```javascript
$("p")
```
2. #id 选择器:通过 HTML 元素的 id 属性选取指定的元素。由于页面中的元素 id 应保持唯一性,因此需要使用 #id 选择器来选取唯一的元素。例如,当用户点击按钮后,有 id="test" 属性的元素将被隐藏,可以使用以下代码:
```javascript
$("#test")
```
3. .class 选择器:可以通过指定的 class 查找元素。例如,用户点击按钮后所有带有 class="test" 属性的元素都隐藏,可以使用以下代码:
```javascript
$(".test")
```
4. * 选择器:选取所有元素。例如,要选取当前 HTML 元素,可以使用以下代码:
```javascript
$(this)
```
5. p.intro 选择器:根据类名选取元素。例如,要选取具有类名为 "intro" 的 `
` 元素,可以使用以下代码:
```javascript
$("p.intro")
```
总之,jQuery 选择器提供了丰富的功能,使得对 HTML 元素的操作变得更加简便。
选取 class 为 intro 的
元素:
```javascript
$("p.intro")
```
选取第一个
元素:
```javascript
$("p:first")
```
选取第一个
- 元素的第一个
- 元素:
```javascript
$("ul li:first")
```
选取每个
- 元素的第一个
- 元素:
```javascript
$("ul li:first-child")
```
选取带有 href 属性的元素:
```javascript
$("a[href]")
```
选取所有 target 属性值等于 "_blank" 的 元素:
```javascript
$("a[target='_blank']")
```
选取所有 target 属性值不等于 "_blank" 的 元素:
```javascript
$("a[target!='_blank']")
```
选取所有 type= "button" 的 元素和
```javascript
$(":button")
```
选取偶数位置的
元素: ```javascript
$("tr:even")
```
选取奇数位置的
元素: ```javascript
$("tr:odd")
```
- 元素: