【jQuery】2、jquery标签选择器

2.标签选择器

<div id="aa" name="aa">id是aa</div>
<p class="bb">class是bb</p>
<div id="cc">
 <div name="cc1">1</div>
 <div name="cc2">2</div>
</div>

$("#aa")		//匹配id=aa的标签
$("div,p");		//匹配所有div与p标签
$("#cc > div");	//选择id=cc的所有子元素
$("p + div");	//匹配p后面的第一个div标签
$("#aa ~ p");	//匹配所有与 id是aa标签 同辈的p标签
$("div[id]")	//查找所有含有 id 属性的 div 元素
$("div[name='aa']")//查找所有 name 属性是 aa 的 div元素
$("div[name^='cc']")//查找所有 name 属性是 cc开头的 div元素
$("div[name$='2']")//查找所有 name 属性是 2结尾的 div元素
$("div[name*='cc']")//查找所有 name 属性包含cc的 div元素
$("div[id][name$='a']")//找到所有含有 id 属性,并且它的 name 属性是以 a 结尾的

2.:选择器

$(":root")		//获取文档的根元素<html>元素
$('li:first');	//选择第一个li标签
$('li:last')	//选择最后一个li标签
$("input:not(:checked)");	//查找所有未选中的 input 元素
$("li:even");	//匹配所有索引值为偶数的li元素,从 0 开始计数
$("li:odd")   	//匹配所有索引值为奇数的li元素,从 0 开始计数
$("li:eq(1)")	//匹配第一个li元素,从 0 开始计数
$("li:gt(2)")	//匹配所有大于索引值2的li元素,从 0 开始计数
$("li:lt(2)")	//匹配所有小于索引值2的li元素,从 0 开始计数
$(":header");	//匹配如 h1, h2, h3之类的标题元素
$(":header").css("background", "#f00");  //匹配如 h1, h2, h3之类的标题元素,将他们的背景都设置红色
$("li:empty")	//匹配所有不包含子元素或者文本的空元素
$("li:parent")	//匹配含有子元素或者文本的li元素
$("li:hidden") 	//匹配所有不可见的li元素,或者type为hidden的元素
$("li:visible")	//匹配所有的可见元素li
$("ul li:first-child")//在每个 ul 中查找第一个 li元素
$("ul li:last-child")//匹配最后一个li子元素
$("ul li:nth-child(2)")//在每个 ul 查找第 2 个li元素
$("ul li:nth-last-child(2)");//在每个匹配的ul中查找倒数第二个li元素
$(":password")	//查找所有密码框
$(":radio")		//匹配所有单选按钮
$(":checkbox")	//匹配所有复选框
$(":button")	//匹配所有按钮

:contains选择器:匹配包含给定文本的元素

<div>John Resig</div>
<div>George Martin</div>
<div>Malcom John Sinclair</div>

$("div:contains('John')")	//[ <div>John Resig</div>, <div>Malcom John Sinclair</div> ]

:has选择器:匹配含有选择器所匹配的元素 的元素

<div><p>Hello</p></div>
<div>Hello again!</div>

$("div:has(p)").addClass("test");	//[ <div class="test"><p>Hello</p></div> ]

:only-child选择器:匹配唯一子元素

<ul>
  <li>John</li>
  <li>Karl</li>
  <li>Brandon</li>
</ul>
<ul>
  <li>Glen</li>
</ul>

$("ul li:only-child")	//[ <li>Glen</li> ]
发布了218 篇原创文章 · 获赞 35 · 访问量 13万+

猜你喜欢

转载自blog.csdn.net/qq_41614928/article/details/102623459