手机
当前位置:查字典教程网 >编程开发 >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获取select值的方法分析

Javascript实现飞动广告效果的方法

Javascript事件触发列表与解说

理解Javascript图片预加载

javascript瀑布流布局实现方法详解

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

JavaScript基本语法讲解

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

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

javascript 动态添加表格行

精品推荐
分类导航