javascript 动态创建表格的2种方法总结
第一种方法:
<html>
<head>
<script>
functioncreateTable(rows,lines){
this.rows=rows;
this.lines=lines;
varBody=document.getElementById('body');
varTable=document.createElement('table');//创建table标签元素
Table.setAttribute('border','1');
//给table标签添加其他属性
for(vari=0;i<this.rows;i++){
varlRow=document.createElement('tr');
for(varj=0;j<this.lines;j++){
vartextNode=document.createTextNode(i+','+j);
varlLine=document.createElement('td');
lLine.appendChild(textNode);
lRow.appendChild(lLine);
}
Table.appendChild(lRow);
}
Body.appendChild(Table);
}
</script>
</head>
<body>
<divid="body"></div>
</body>
<scripttype="text/javascript">
createTable(10,10);
</script>
</html>
第二种方法:
<script>
functioncreateTable(rows,lines){
this.rows=rows;
this.lines=lines;
varBody=document.getElementById('body');
varTable=document.createElement('table');
Table.setAttribute('border',1);
for(vari=0;i<this.rows;i++){
varrow=Table.insertRow(i);
for(varj=0;j<this.lines;j++){
varcells=row.insertCell(j);
cells.innerHTML=i+','+j
}
}
Body.appendChild(Table);
}
</script>
以上2种方法小伙伴们是否都了解了呢,如有更好的方法,也请大家留言说明下,大家共同进步。
热门推荐
10 盛夏的温馨祝福语简短
11 男升职祝福语大全简短
12 贺卡祝福语宝宝男孩简短
13 对睡觉的祝福语简短
14 财运健康成语祝福语简短
15 简短祝福语乔迁新家贺词
16 韩语贺卡祝福语简短版
17 爸爸生日举杯祝福语简短
18 升职蛋糕祝福语大全简短