jQuery 基础选择器

Posted 2021-07-13 乱舞春秋__

jQuery 选择器可以用来获取html元素，它基于已经存在的CSS选择器，除此之外，它还有一些自定义的选择器。jQuery 中所有选择器都以美元符号开头（$）。

语法格式：

$( 'selector')

常见的jQuery 选择器：

1.元素选择器

jQuery 元素选择器基于元素名选取元素。

语法格式：

$('tagName')

2.#id选择器

获取指定ID名称的元素

语法格式：

$('#idName')

3..class选择器

获取具有指定类名称的所有元素

语法格式：

$('.className')

4. 通配符选择器

获取所有元素

语法格式：

$('*')

5.交集选择器

示例：

$('div.box') //获取类名称为box的div元素

6.并集选择器

示例：

$('div,span,p') //获取div,span,p元素

7.子代选择器（使用>号）

示例：

获取ul 的直接子元素li

$('ul>li') 

8.后代选择器 （使用空格）

示例：

获取ul 的后代元素中的所有li元素

$('ul li') 

其他用法：

$(this) ： 选取当前 HTML 元素

$("ul li:first-child") : 取每个 <ul> 元素的第一个 <li> 元素

$("[href]") : 选取带有 href 属性的元素

$(":button") : 选取所有 type="button" 的 <input> 元素 和 <button> 元素

$("a[target!='_blank']") : 选取所有 target 属性值不等于 "_blank" 的 <a> 元素

$("a[target='_blank']") :选取所有 target 属性值等于 "_blank" 的 <a> 元素