JavaScript DHTML/jQuery/eq
Содержание
eq(index) returns the element position in matched elements starts at 0 and goes to length - 1.
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("div").eq(2).css("color","blue");
});
</script>
<style>
.selected { color:red; }
.highlight { background:yellow; }
</style>
</head>
<body>
<body>
<div id="single">asdf</div>
<div id="single">asdf</div>
<div id="single">asdf</div>
<div id="single">asdf</div>
</body>
</html>
eq: select by index
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
var tmpExample = {
ready : function() {
$("ul li").eq(3).addClass("justAdd");
}
};
$(document).ready(tmpExample.ready);
</script>
<style type="text/css">
ul {
list-style: none;
margin: 0;
padding: 0;
}
ul li {
margin: 1px;
padding: 3px;
}
li.justAdd {
background: #cdb6ed;
}
</style>
</head>
<body>
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
</ul>
</body>
</html>
Reduces the selection to the second selected element.
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p").eq(1).css("color", "red");
});
</script>
</head>
<body>
<body>
<p>A</p><p>B</p>
</body>
</html>
Reduce the set of matched elements to a single element
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("div").eq(2).addClass("blue");
});
</script>
<style>
.blue { background:blue; }
</style>
</head>
<body>
<body>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
</body>
</html>