• 欢迎访问开心洋葱网站,在线教程,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站,欢迎加入开心洋葱 QQ群
  • 为方便开心洋葱网用户,开心洋葱官网已经开启复制功能!
  • 欢迎访问开心洋葱网站,手机也能访问哦~欢迎加入开心洋葱多维思维学习平台 QQ群
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏开心洋葱吧~~~~~~~~~~~~~!
  • 由于近期流量激增,小站的ECS没能经的起亲们的访问,本站依然没有盈利,如果各位看如果觉着文字不错,还请看官给小站打个赏~~~~~~~~~~~~~!

javascript table 隔行变色代码

JavaScript 水墨上仙 2774次浏览

javascript table 隔行变色代码

function changeTableColor(oddColor,evenColor){
	var tables=document.getElementsByTagName('table');
	for(var i=0;i<tables.length;i++){
		var table=tables[i];
		var childs=table.childNodes;
		for(var j=0;j<childs.length;j++){
			var child=childs[j];
			if(child.nodeName=='TBODY'){
				var trs=child.childNodes;
				for(var x=0;x<trs.length;x++){
					if(trs[x].nodeName=='TR'){
						var tr=trs[x];
						if(x%4==0 ){
							trs[x].style.backgroundColor=oddColor;
						}
						if(x%4==2){
							trs[x].style.backgroundColor=evenColor;
						}
					}
				}
			}
		}
	}
}

调用代码

window.onload=function(){  
    changeTableColor('#ddd','#eee');  
} 


开心洋葱 , 版权所有丨如未注明 , 均为原创丨未经授权请勿修改 , 转载请注明javascript table 隔行变色代码
喜欢 (0)
加载中……