js表格隔行变色 鼠标颠末调动颜色代码

　　关于js隔行换色的殊效，猛火早年曾经提到不少，本日刚巧在某措施员的博客又看到一款较量不错的精简代码，还实现的鼠标的感伤调动颜色，起首我们往返首一下原本的殊效：

　　2009年11月，猛火先后颁发了《JavaScript 实现表格隔行换色的结果》、《表格隔行换色殊效 很是适用的哦》

　　2010年7月，又颁发了《jQuery 隔行换色 鼠标滑动单行变色代码》，让我们感觉到jQuery的魅力。

　　好了，再看一下本文的殊效：

<title>隔行变色+鼠标颠末变色JS结果 - Liehuo.Net</title> 隔行变色+鼠标颠末变色JS结果 <br /><br /> <script language="javascript"> function show(){ var tab=document.getElementById("tab"); var tr=tab.getElementsByTagName("tr"); for(var i=0;i<=tr.length;i++){ if(i%2==0){ tr[i].style.backgroundColor="#ccc"; tr[i].onmouseover=function(){this.style.background="red"}; tr[i].onmouseout=function(){this.style.background="#ccc"} }else{ tr[i].style.backgroundColor="#fff"; tr[i].onmouseover=function(){this.style.background="red"}; tr[i].onmouseout=function(){this.style.background="#fff"} } } } window.onload=show; </script> <table id="tab"> <tr><td>猛火网 - 教程富厚的收集学院</td><td>猛火网 - 教程富厚的收集学院</td></tr> <tr><td>猛火网 - 教程富厚的收集学院</td><td>猛火网 - 教程富厚的收集学院</td></tr> <tr><td>猛火网 - 教程富厚的收集学院</td><td>猛火网 - 教程富厚的收集学院</td></tr> <tr><td>猛火网 - 教程富厚的收集学院</td><td>猛火网 - 教程富厚的收集学院</td></tr> <tr><td>猛火网 - 教程富厚的收集学院</td><td>猛火网 - 教程富厚的收集学院</td></tr> </table> <br /><center>如不能表现结果，请按Ctrl+F5革新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
提醒：可修改儿女码再运行!　

（编辑：湖南网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!