表格 隔行换色升级版_Javascript教程-查字典教程网
表格 隔行换色升级版
表格 隔行换色升级版
发布时间:2016-12-30 来源:查字典编辑
摘要:昨天弄了个表格隔行换色,但是只是一张表里换如果一个页面里出现多个表格需要怎么整捣鼓出新的结果如下:复制代码代码如下:functiononlo...

昨天弄了个表格隔行换色,但是只是一张表里换

如果一个页面里出现多个表格需要怎么整

捣鼓出新的结果

如下:

复制代码 代码如下:

function onloadEvent(func){

var one=window.onload

if(typeof window.onload!='function'){

window.onload=func

}

else{

window.onload=function(){

one();

func();

}

}

}

function showtable(tableid){

var overcolor='#FCF9D8';

var color1='#FFFFFF';

var color2='#F8F8F8';

var tablename=document.getElementById(tableid)

var tr=tablename.getElementsByTagName("tr")

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

tr[i].onmouseover=function(){

this.style.backgroundColor=overcolor;

}

tr[i].onmouseout=function(){

if(this.rowIndex%2==0){

this.style.backgroundColor=color1;

}else{

this.style.backgroundColor=color2;

}

}

if(i%2==0){

tr[i].className="color1";

}else{

tr[i].className="color2";

}

}

}

onloadEvent(function init(){

showtable('table');

showtable('test');

}

);

这样在html里增加表格的时候加上ID就OK了,一个多次调用的表格隔行换色完毕

牛逼的人生不需要解释

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类