pageEncoding="utf-8"%>
Jquery演示示例#tb{
border:1px solid blue;
width: 500px;
border-collapse: collapse;
cursor:point;
}
#tb td{
border:1px solid blue;
padding:3px;
}
#tb th{
background: gray;
padding: 3px;
}
.even{
background:red;
}
.over{
background: yellow;
}
$(function(){
$("#td tr:odd").addClass("even");//给奇数行添加类样式
//分两步实现
/* $("#tb tr:gt(0)").mouseover(function(){
//注意,这里的this对象是js-dom对象,如果想调用jQuery中的方法,得转化成JQuery中的对象
$(this).addClass("over");
});
$("#tb tr:gt(0)").mouseout(function(){
$(this).removeClass("over");
}); */
//行云流水
$("#tb tr:gt(0)").mouseover(function(){
$(this).addClass("over");
}).mouseout(function(){
$(this).removeClass("over");
});
});
姓名 | 年龄 | 电话 |
---|---|---|
张三 | 22 | 13107172719893 |
王五 | 42 | 13107176587271 |
西欧 | 32 | 1310121323893 |
李四 | 22 | 13107172719893 |
--%>
pageEncoding="UTF-8"%>
JQuery演示示例#tb{
border: 1px solid blue;
width:500px;
border-collapse: collapse;
cursor:point;
}
#tb td{
border: 1px solid blue;
padding:3px;
}
#tb th{
background:gray;
padding:3px;
}
.even{
background: red;
}
.over{
background: yellow;
}
$( function(){
$("#tb tr:odd").addClass("even"); //给奇数行添加类样式
/*分两步实现
$("#tb tr:gt(0)").mouseover(function(){
//注意,这里的this对象是js-dom对象,如果想调用jQuery中的方法,得转换成JQuery对象
//alert( this instanceof $); //false
$(this).addClass("over");
});
$("#tb tr:gt(0)").mouseout(function(){
$(this).removeClass("over");
});
*/
//行云流水
$("#tb tr:gt(0)").mouseover(function(){
$(this).addClass("over");
}).mouseout(function(){
$(this).removeClass("over");
});
});
姓名 | 年龄 | 电话 |
---|---|---|
张三 | 22 | 13512345678 |
张三 | 22 | 13512345678 |
张三 | 22 | 13512345678 |
张三 | 22 | 13512345678 |
张三 | 22 | 13512345678 |