php对表格的处理,JavaScript_js处理表格对table进行修饰，js处理表格 1、行颜色间隔显示 - phpStudy...

js处理表格对table进行修饰

js处理表格

1、行颜色间隔显示

css样式：两个选择器

.one{

background-color:#33ffcc;

}

.two{

backgound-color:#ffff66;

}

function trcolor()

//控制间隔行颜色显示不同

{

var tabNode = document.getElementsByTagName("table")[0];

//获取table节点

var trs = tabNode.rows;

//获取table中的所有的行

for(var x=1; x

{

if(x%2 == 1)

trs[x].className ="one";

else

trs[x].className ="two";

}

//通过onload方法，在网页加载完成后，运行trcolor方法，实现表格的间隔行颜色。

window.onload = function()

{

trcolor();

}

2、鼠标移动到某一行，改行颜色加亮，移开后恢复原来颜色

.over{

background-color:##00ff00;

}

var name;

function trMouse()

{

var tabNode = document.getELementsByTagName("table")[0];

//通过for循环，对每个tr标签加上onmouseover与onmouseout属性

for(var x=0;x

{

trs[x].onmouseover = function()

{

name=this.className;

this.className="over";

}

tes[x].onmouseout = function()

{

this.className = name;

}