您的位置：首页 > 其它

创建动态表格（节点创建以及表格隔行变色）

2014-03-17 11:16 169 查看

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<style>

table{border:1px #FF0000 groove;}

.r1{border:1px #0000FF dotted;background-color:#FFFFFF;}

.r2{background-color:#00FFFF;};

</style>

<script>

function createTale(row,col){

var table=document.createElement("table");

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

for(var i=0;i<row;i++){

var tr=document.createElement("tr");

for(var j=0;j<col;j++){

var td=document.createElement("td");

td.innerText="列"+(j+1);

tr.appendChild(td)

}

table.appendChild(tr);

}

body.appendChild(table);

changeColor();
}

function changeColor(){

var tr=document.getElementsByTagName("tr");

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

if(i%2==0)

tr[i].className="r2";

else

tr[i]=className="r1";

}

}

</script>

<title>无标题文档</title>

</head>

<body onload="createTale(8,8)">

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航