手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >javascript 动态创建表格
javascript 动态创建表格
摘要:复制代码代码如下:functioncreateTable(rows,lines){this.rows=rows;this.lines=lin...

复制代码 代码如下:

<html>

<head>

<script>

function createTable(rows,lines){

this.rows=rows;

this.lines=lines;

var Body=document.getElementById('body');

var Table=document.createElement('table');//创建table标签元素

Table.setAttribute('border','1');

//给table标签添加其他属性

for(var i=0;i<this.rows;i++){

var lRow=document.createElement('tr');

for(var j=0;j<this.lines;j++){

var textNode=document.createTextNode(i+','+j);

var lLine=document.createElement('td');

lLine.appendChild(textNode);

lRow.appendChild(lLine);

}

Table.appendChild(lRow);

}

Body.appendChild(Table);

}

</script>

</head>

<body >

<div id="body"></div>

</body>

<script type="text/javascript">

createTable(10,10);

</script>

</html>

第二种方法:

复制代码 代码如下:

<script>

function createTable(rows,lines){

this.rows=rows;

this.lines=lines;

var Body=document.getElementById('body');

var Table=document.createElement('table');

Table.setAttribute('border',1);

for(var i=0;i<this.rows;i++){

var row=Table.insertRow(i);

for(var j=0;j<this.lines;j++){

var cells=row.insertCell(j);

cells.innerHTML=i+','+j

}

}

Body.appendChild(Table);

}

</script>

【javascript 动态创建表格】相关文章:

javascript 动态创建表格的2种方法总结

javascript动态创建表格及添加数据实例详解

javascript制作的滑动图片菜单

javascript的事件描述

javascript实现table表格隔行变色的方法

JavaScript获得指定对象大小的方法

javascript实时显示当天日期的方法

JavaScript中string对象

javascript基于DOM实现权限选择实例分析

javascript生成不重复的随机数

精品推荐
分类导航