JavaScript Tutorial/jQuery/eq
Содержание
eq(index) returns the element position in matched elements starts at 0 and goes to length - 1.
<source lang="javascript">
<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>
asdf
asdf
asdf
asdf
</body>
</html></source>
eq: select by index
<source lang="javascript">
<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>
- A
- B
- C
- D
</body>
</html></source>
Reduces the selection to the second selected element.
<source lang="javascript">
<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>
A
B
</body>
</html></source>
Reduce the set of matched elements to a single element
<source lang="javascript">
<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>
asdf
asdf
asdf
asdf
asdf
asdf
</body>
</html></source>
