1.代码实现:
<!DOCTYPE html>
<html lang=\"en\">
<head>
<meta charset=\"UTF-8...
1.代码实现:
<!DOCTYPE html>
<html lang=\"en\">
<head>
<meta charset=\"UTF-8\">
<title>Title</title>
<style>
.originColor{
background-color: red;
}
</style>
<script>
window.onload = function() {//等待页面加载(标签,图片,视频等等)完毕后,才运行下面的代码,当然,你可以把全部的逻辑代码放在body的最后一行
var oRows = document.getElementsByTagName(\"tr\");
for (var i = 0; i < oRows.length; i++) {
oRows[i].onmouseover = function() {
this.style.backgroundColor = \"yellow\";//此处this代表点击到的某一行的DOM对象
}
oRows[i].onmouseout = function() {
this.style.backgroundColor=\"red\";//使用className无法实时改变其颜色
}
}
}
</script>
</head>
<body>
<table cellspacing=\"0px\" class=\"originColor\"
border=\"1px\" width=\"200px\" height=\"60px\" >
<tr>
<td ></td>
</tr>
<tr>
<td ></td>
</tr>
<tr>
<td ></td>
</tr>
</table>
</body>
</html>
2.QA:
- 整个HTML页面到底是如何加载的?
- .className和.backgroundColor背后的原理
版权声明
本文仅代表作者观点，不代表百度立场。
本文系作者授权百度百家发表，未经许可，不得转载。
