JavaScript DHTML/jQuery/Selector table — различия между версиями
Admin (обсуждение | вклад) м (1 версия) |
|
(нет различий)
|
Текущая версия на 10:24, 26 мая 2010
Содержание
Finds all table row containing "F"
<source lang="html4strict">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("tr:contains("F")").css("background-color", "#bbbbff"); }); </script> </head> <body> <body>
First |
Middle |
Last |
</body>
</html>
</source>
Finds all tds with children, including text.
<source lang="html4strict">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("td:parent").fadeTo(1500, 0.3); }); </script> </head> <body> <body>
Value 1 | |
Value 2 |
</body>
</html>
</source>
Finds even table rows
<source lang="html4strict">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("tr:even").css("background-color", "red"); }); </script> </head> <body> <body>
TD #0 | TD #1 | TD #2 |
TD #3 | TD #4 | TD #5 |
TD #6 | TD #7 | TD #8 |
</body>
</html>
</source>
Finds TD #1 and higher
<source lang="html4strict">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("tr:gt(1)").css("background-color", "red"); }); </script> </head> <body> <body>
TD #0 | TD #1 | TD #2 |
TD #3 | TD #4 | TD #5 |
TD #6 | TD #7 | TD #8 |
</body>
</html>
</source>
Finds TDs less than the one with the second index
<source lang="html4strict">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("td:lt(2)").css("color", "red"); }); </script> </head> <body> <body>
First |
Middle |
Last |
</body>
</html>
</source>
Finds the last table row.
<source lang="html4strict">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("tr:last").css({backgroundColor: "yellow", fontWeight: "bolder"}); }); </script> </head> <body> <body>
First |
Middle |
Last |
</body>
</html>
</source>