📅 最后修改于: 2023-12-03 15:02:15.607000 🧑 作者: Mango
jQuery是一款广泛使用的JavaScript库，它使得处理DOM元素和事件变得更加简单、快捷。本文将介绍jQuery中的特定子索引，它能够让我们更加方便地选择HTML元素。
jQuery中有三种特定子索引：:first、:last和:eq()。它们可以与选择器组合使用，用于选择集合中的特定元素。
:first：选择集合中第一个元素。:last：选择集合中最后一个元素。:eq(index)：选择集合中索引为index的元素。例如，$("div:first")将选择页面中第一个<div>元素，$("p:last")将选择页面中最后一个<p>元素，$("ul li:eq(2)")将选择页面中第三个<li>元素。
<!DOCTYPE html>
<html>
<head>
<title>jQuery特定子索引 - HTML</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
// 选择第一个<p>元素，并将其文本设置为红色
$("p:first").css("color", "red");
// 选择最后一个<p>元素，并将其文本设置为蓝色
$("p:last").css("color", "blue");
// 选择第二个<li>元素，并将其文本设置为绿色
$("ul li:eq(1)").css("color", "green");
});
</script>
</head>
<body>
<p>第一个段落</p>
<p>第二个段落</p>
<ul>
<li>第一个列表项</li>
<li>第二个列表项</li>
<li>第三个列表项</li>
</ul>
</body>
</html>
本文介绍了jQuery中的特定子索引，它们能够让我们更加方便地选择HTML元素。：first选择集合中第一个元素，:last选择集合中最后一个元素，：eq(index)选择集合中索引为index的元素。学会使用这些特定子索引将有助于我们编写更简洁、高效的jQuery代码。