<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="img/jquery-3.4.1.js"></script>
<script type="text/javascript">
$(function(){
$("tbody tr:even").css("background","red");
$("tbody tr:odd").css("background","green");
$("#div1").mousemove(function(){
$("#div1").css("background-color","yellow");
});
$("#div1").mouseleave(function(){
$("#div1").css("background-color","red");
});
$("#div2").mousemove(function(){
$("#div2").css("background-color","blue");
});
$("#div2").mouseleave(function(){
$("#div2").css("background-color","green");
});
$("#div3").mousemove(function(){
$("#div3").css("background-color","yellow");
});
$("#div3").mouseleave(function(){
$("#div3").css("background-color","red");
});
$("#div4").mousemove(function(){
$("#div4").css("background-color","blue");
});
$("#div4").mouseleave(function(){
$("#div4").css("background-color","green");
});
});
</script>
</head>
<body>
<table border="1" align="center">
<thead>
<th>
<div style="width: 200px;height: 30px;cursor: pointer;">
表头
</div>
</th>
</thead>
<tbody>
<tr>
<td align="center">
<div style="width: 200px;height: 30px;cursor: pointer;" id="div1">
1
</div>
</td>
</tr>
<tr>
<td align="center">
<div style="width: 200px;height: 30px;cursor: pointer;" id="div2">
2
</div>
</td>
</tr>
<tr>
<td align="center">
<div style="width: 200px;height: 30px;cursor: pointer;" id="div3">
3
</div>
</td>
</tr>
<tr>
<td align="center">
<div style="width: 200px;height: 30px;cursor: pointer;" id="div4">
4
</div>
</td>
</tr>
</tbody>
</table>
</body>
</html>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
