隔行换色，那么发生在行上，所以事件写在行上，onmouseover为鼠标移动到该区域，onmouseout为鼠标移出该区域，无论移出，还是移入都调用check方法，这个方法传递两个参数（“”中加引号只能用单引号‘’），第一个是所在行的id用于获取改行，另一个是类型，over表示移入，out表示移出，方法内部根据这两个参数来判断具体情况，over时背景颜色为红色，表示高亮显示，out时背景颜色为白色，效果为

光标放在第一行

光标离开第一行

上面完成了基本的要求，但是他还有以下不足之处，比如给每行都添加了事件，如果行太多，这种静态的添加事件不太合适，所以我们应该动态遍历到所有的行，然后js中动态添加方法，这样就不用给每一行，动态的添加事件了，而且在上面代码中是在js中设置了背景颜色，这样不好应该js和css分开，所以只要在js中设置好移入时行的classname，然后css中显示移入时的样式，和移出时行的classname，然后css中显示移出时的样式

以上程序就是动态给每行添加了移入和移出两个事件，然后方法内部设置成每行在移入移出时不同的className，不同的className对应不同的样式，所以就会产生不同的效果了。

注意这里是this，而不是trs[x]，因为这里添加事件之后，事件只会在onmouseover的时候才会运行，就是鼠标移入的时候，而运行的时候根本不知道tr[x]是什么了，所以这里只能用this，this表示当前事件的源对象，把当前事件的源对象的className设置成对应的样子即可。

js中常用事件的总结

onfocus/onblur:聚焦离焦事件，用于表单校验的时候比较合适。

onclick/ondblclick:鼠标单击和双击事件

onkeydown/onkeypress：搜索引擎使用较多，比如一回车他就自动搜索

onload：页面加载事件，所有的其它操作(匿名方式)都可以放到这个绑定的函数里面去。如果是有名称，那么在html页面中只能写一个。

onmouseover/onmouseout/onmousemove：购物网站商品详情页。

onsubmit：表单提交事件 ，有返回值，控制表单是否提交。

onchange:当用户改变内容的时候使用这个事件(二级联动)

onkeypress举例

<input type="text" onkeyPress="ketDemo()"/>

function keyDemo(){

if(!(window.event.keyCode>=48&&window.event.leyCode<=57)){//如果按的这个键是0（48）到9（57）

alert("不允许数字录入");

event.returnValue=false;//事件取消

}

var node=event.srcElement;//获取事件对象，哪里产生的事件

alert(node.type);//类型 text

alert(node.nodename);名字 input

}

window事件

window.onload页面加载，页面打开

window.onunload页面关闭

window.onbeforeunload窗体关闭

window.focus窗口前置

每天分享编程知识，欢迎关注