用jQuery让表格偶数行样式渐变,鼠标移上去样式变化
| Year | Make | Model |
|---|---|---|
| 1965 | Ford | Mustang |
| 1970 | Toyota | Corolla |
| 1979 | AMC | Jeep CJ-5 |
| 1983 | Ford | EXP |
| 1985 | Dodge | Daytona |
| 1990 | Chrysler | Jeep Wrangler Sahara |
| 1995 | Ford | Ranger |
| 1997 | Chrysler | Jeep Wrangler Sahara |
| 2000 | Chrysler | Jeep Wrangler Sahara |
| 2005 | Chrysler | Jeep Wrangler Unlimited |
| 2007 | Dodge | Caliber R/T |
Jquery代码:
1 $("table tr:nth-child(even)").addClass("striped");//even或者2n为偶数行,2n+1为奇数行
2
3 $("tr").mouseover(function() {
4 $(this).addClass("over");
5 }).mouseout(function() {
6 $(this).removeClass("over");
7 })
这里有一个JQuery的链式操作
$("tr").mouseover(funtion(){
$(this).addClass("over");})
$("tr").mouseout(funtion(){
$(this).removeClass("over");})
可以写成上面的形式。
浙公网安备 33010602011771号