Home > Article > Web Front-end > What is the method to get the li number in jquery?
Obtaining method: 1. Use the eq() method to select the li element at the specified index position. The syntax is "$("li").eq (index number)"; 2. Use ":eq( )" selector, you can select the li element at the specified index position, the syntax is "$("li:eq(index number)")".
The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.
jquery gets the number of li
1. Use the eq() method
eq () method returns the element with the specified index number of the selected element. Index numbers start with 0, so the index number of the first element is 0 (not 1).
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="js/jquery-1.10.2.min.js"></script>
<style>
.siblings * {
display: block;
border: 2px solid lightgrey;
color: lightgrey;
padding: 5px;
margin: 15px;
}
</style>
<script>
$(document).ready(function() {
$("li").eq(2).css({
"color": "red",
"border": "2px solid red"
});
});
</script>
</head>
<body>
<div style="width:500px;" class="siblings">
<ul>ul (父节点)
<li>第一个子元素</li>
<li>第二个子元素</li>
<li>第三个子元素</li>
<li>第四个子元素</li>
<li>第五个子元素</li>
</ul>
</div>
<p>选择第3个li元素（索引号为2）</p>
</body>
</html>
2. Use the ":eq()" selector
:eq() selector to select the specified index value element. Index values start at 0, and all first elements have an index value of 0 (not 1).
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="js/jquery-1.10.2.min.js"></script>
<style>
.siblings * {
display: block;
border: 2px solid lightgrey;
color: lightgrey;
padding: 5px;
margin: 15px;
}
</style>
<script>
$(document).ready(function() {
$("li:eq(1)").css({
"color": "red",
"border": "2px solid red"
});
});
</script>
</head>
<body>
<div style="width:500px;" class="siblings">
<ul>ul (父节点)
<li>第一个子元素</li>
<li>第二个子元素</li>
<li>第三个子元素</li>
<li>第四个子元素</li>
<li>第五个子元素</li>
</ul>
</div>
<p>选择第2个li元素（索引号为1）</p>
</body>
</html>
[Recommended learning: jQuery video tutorial, web front-end video】
The above is the detailed content of What is the method to get the li number in jquery?. For more information, please follow other related articles on the PHP Chinese website!