jQuery常用选择器
【标签选择器】
代码语言：javascript复制 <script src="https://code.jquery.com/jquery-3.4.0.min.js"></script>
<!-- 标签选择器 -->
<h1>清平调</h1>
<h3>李白</h3>
<script>
$("h1").attr("style", "font-size:3rem;text-align:center");
$("h3").attr("style", "font-size:1.2rem;text-align:center");
</script>【id选择器】
代码语言：javascript复制<script src="https://code.jquery.com/jquery-3.4.0.min.js"></script>
<!-- id选择器 -->
<hr id="hr_1" />
<script>
$("#hr_1").attr("color", "red");
$("#hr_1").attr("width", "30%");
</script>【class选择器】
代码语言：javascript复制<script src="https://code.jquery.com/jquery-3.4.0.min.js"></script>
<!-- class选择器 -->
<p class="info">云想衣裳花想容，</p>
<p class="info">春风拂槛露华浓。</p>
<p class="info">若非群玉山头见，</p>
<p class="info">会向瑶台月下逢。</p>
<script>
var classes = $(".info");
classes.attr("style", "text-align:center;font-size:1.7rem");
</script>【集合选择器】
代码语言：javascript复制<script src="https://code.jquery.com/jquery-3.4.0.min.js"></script>
<!-- 集合选择器 -->
<style>
ul {
list-style: none;
padding: 0px;
font-size: 1.5rem;
width: 30%;
}
</style>
<ul>
<li>0:A</li>
<li>1:B</li>
<li>2:AB</li>
<li>3:O</li>
<li>4:H </li>
<li>5:H-</li>
</ul>
<script>
//获取集合中所有的奇数下标:odd/偶数下标:even
var ul = $("ul li:odd");
ul.attr("style", "background-color:skyblue");
var oul = $("ul li:even");
oul.attr("style", "background-color:pink");
</script>效果：
希望能对大家有所帮助。
