7 建立报表鼠标点击处高亮显示

来源：互联网发布：战狼2影评知乎编辑：程序博客网时间：2024/05/16 09:31

1 index.html 文件

<!DOCTYPE html>

<head>

<title>JavaScripe程序开发</title>

<scripttype="text/javascript" src="1.js"></script>

</head>

<body>

</tr>

</tr>

</tr>

</tr>

</table>

</div>

</body>

</html>

2 1.js 文件

/**

obj ：表示当前要改变的颜色的对象；

color : 设置要显示的颜色

/*function changeColor (obj,color) {

obj.bgColor= color;

}

window.onload = function(){ //为onload事件绑定处理

vartrObj = document.getElementById("infoTr");

trObj.addEventListener("mouseover",function(){

//this表示当前的对象，实际上就是tr，鼠标进去的地方，标记成白色

changeColor(this,'FFFFF');

}；false);

trObj.addEventListener("mouseout",function(){

//鼠标出来的地方，还原成原来的颜色

changeColor(this,'F2F2F2');

}；false);

}*/

//document.getElementById("infoTr");只能取得具有相同的id 的第一个对象，即此时，鼠标移动只对第一个对象的设置起作用，

//要想取得相同id 的所有的对象，则使用document.all(id)返回的是一个相同ID的对象

//的数组，此时，可以通过循环，获取数组中的对象，让其进行所有对象的操作；

function changeColor (obj,color) {

obj.bgColor= color;

}

window.onload = function(){ //为onload事件绑定处理

vartrObj = document.all("infoTr");

for(var i = 0 ; i < trObj.length; ++i) {

trObj[i].addEventListener("mouseover",function(){

//this表示当前的对象，实际上就是tr，鼠标进去的地方，标记成白色

changeColor(this,'FFFFF');

},false);

trObj[i].addEventListener("mouseout",function(){

//鼠标出来的地方，还原成原来的颜色

changeColor(this,'F2F2F2');

},false);

}

0 0