jQuery 选择器
`<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="static/js/jquery-3.4.1.min.js"></script>
<h2>jQuery id选择器</h2>
</head>
<body>
<div id="div1" class="class1">
<p id="i1" class="c1">1</p>
<p id="i2" class="c3">2</p>
</div>
<div id="div2" class="class1">
<p id="i3" class="c3">3</p>
<ul>
<li>12</li>
<li>11</li>
<li> <p id="i7" class="c8">8</p></li>
</ul>
</div>
<p id="i6" class="c6">6</p>
<div id="div3" class="class3">
<p id="i5" class="c5">5</p>
</div>
<div id="div4" class="class4">
<ul>
<li>12</li>
<li>11</li>
<li> <p id="i4" class="c4">4</p></li>
</ul>
</div>
<script type="text/javascript">
// id选择器
let iddiv= $(‘#div3’);
console.log(iddiv);
let idp= $(‘#i4’);
console.log(idp);
//通配符选择器
let aa=$(‘div’);
console.log(aa);
//类选择器
let class1=$(‘.class3’);
console.log(class1);
let c=$(‘.class1’);
console.log(c);
//后代选择器
let d=$(‘div p’);
console.log(d);
let e=$(‘#div2 p’);
console.log(e);
//直系选择器
let f=$(‘.class1>p ‘);
console.log(f);
//相邻的兄弟选择器
let g=$(‘#div2+p’);
console.log(g);
let h=$(‘#div3+p’);
console.log(h);
//后面的兄弟选择器
let t=$(‘#div1~div’);
console.log(t);
let s=$(‘#i1~p’);
console.log(s);
</script>
</body>
</html>`
总结
jquery选择器 和css选择器差不多，经过本次复习，基本上掌握了选择器。