JavaScript动态创建表的两种方法分享给大家，具体实现如下。

方法1:最原始的方法是逐个创建元素。

var a1=document . create element(' table ')；var a2=document . create element(' t body ')；var a3=document . create element(' tr ')；var a4=document . create element(' TD ')；//start appendchild()追加每个元素a3 . append child(a4)；a2 . appendchild(a3)；a1 . appendchild(a2)；方法2:使用表对象中包含的函数：插入行和插入列。

var TabNode=document . createElement(' table ')；var trNode=TabNode . insertRow()；var tdNode=trNode.insertCellTabNode.innerHTML='这是使用table对象中的函数创建的'注意：当使用原始方法逐个创建Element时，必须添加一个tbody对象//获取table标记的同级节点//varno de 3=tab node . previoussible；//上一个节点获取该对象的上一个同级对象的引用。//alert(' previous-node 3: ' node 3)；//#text//如果表后有回车，则较高版本IE和Firefox会被标识为“空文本”#text，//而较低版本IE会直接传过去——不仅是表节点，其他节点也一样。//在表中，表标签和tr标签之间其实隐藏着一个tbody标签——表体的动态创建和删除：

函数create table(){ tableNode=document . createelement(' table ')；//获取对象tablenode.setattribute ('id '，' table ')var row=par sent(document . getelementsbyname(' row 1 ')[0]。值)；//获取行号//alert(行)；If(row=0 || isNaN(row) ){ alert('输入的行号错误，无法创建表。请重新输入：')；返回；} var cols=ParSeint(document . GetElementsByname(' cols 1 ')[0]。值)；如果(isNaN(cols) || cols=0){ alert('输入的列号错误，无法创建表，请重新输入：')；返回；}//上面确定现在开始创建(var x=0；xrowx){ var trNode=tablenode . insertrow()；for(var y=0；ycolsy){ var tdNode=trnode . insertcell()；tdnode . innerhtml=' cell '(x ^ 1)'-'(y ^ 1)；} } document . getelementbyid(' div 1 ')。appendChild(tableNode)；//添加到该位置}删除该行：

Function delRow(){ //要删除一行，必须得到一个table对象才能删除，所以创建时必须设置table对象的id，便于操作vartab=document . getelementbyid(' table ')；//如果(tab==null){ alert('删除的表不存在！')返回；} var rows=ParSeint(document . GetElementsByname(' delrow 1 ')[0]。值)；//获取要删除的对象，如果(isNaN(row)){ alert('输入的行不正确。请输入要删除的行。');返回；} if(rows=1 rows=tab . rows . length){ tab . deleterow(rows-1)；}else{ alert('不存在！');返回；}}删除列：

//删除列比较麻烦，需要按行删除。//一行中单元格的长度就是列数。//tab.rows [x]。Delete cell (cols-1)函数del cols(){//获取table对象vartab=document . getelementbyid(' table ')；if(tab==null){ alert('不存在！');返回；}//获取文本框varcols=par sent(document . getelementsbyname(' delcols 1 ')[0]中的内容。值)；//检查是否可靠。if(isNaN(cols)){ alert('输入不正确。请输入要输出的列。');返回；} if(！(cols=1 colstab.rows [0]。cells.length)) {alert('您要删除的行不存在！');返回；} for(var x=0；xtab . rows . length；X ){//所有行选项卡. rows。delete cell(cols-1)；}}完整代码：

！DOCTYPE html html head titlecreateTable2.html/title style type=' text/CSS ' table { border : # 00 ffff solid 2px；边框塌陷：} TD {边框： # 8080 ff实心2pxpadd :10 px }/样式脚本类型=' text/JavaScript ' var tableNode；函数create table(){ tableNode=document。create element(' table ')；//获得对象tableNode.setAttribute('id '，' table ')var row=parseInt(文档。getelementsbyname('第1行')[0].值);//获得行号//警报(行);if(row=0 || isNaN(row) ){ alert('输入的行号错误，不能创建表格，请重新输入：');返回；} var cols=ParSeint(文档。GetElementsByname(' cols 1 ')[0].值);if(isNaN(cols) || cols=0){ alert('输入的列号错误，不能创建表格，请重新输入：');返回；} //上面确定了现在开始创建for(var x=0；xrowx){ var trNode=tablenode。insert row()；for(var y=0；ycolsy){ var tdNode=trnode。insert cell()；' tdNode.innerHTML='单元格(x 1)'-'(y 1)；} }文档。getelementbyid(' div 1 ').appendChild(tableNode)；//添加到那个位置}函数delRow(){ //要删除行，必须得到桌子对象才能删除，所以在创建的时候必须要设置桌子对象的编号方便操作var tab=文档。getelementbyid(' table ')；//获得桌子对象if(tab==null){ alert('删除的表不存在!')返回；} var rows=ParSeint(文档。GetElementsByname(' delrow 1 ')[0].值);//获得要删除的对象if(ISnan(row)){ alert('输入的行不正确。请输入要删除的行。');返回；} if(row=1 row=tab。行。长度){ tab。delete row(row-1)；}else{ alert('删除的行不存在！');返回；} } //删除列要麻烦些，要通过行来进行删除//一行的细胞的长度就是列的个数//tab.rows[x].删除单元格(列-1)函数delCols(){ //获得桌子对象var tab=文档。getelementbyid(' table ')；if(tab==null){ alert('删除的表不存在！');返回；} //获得文本框里面的内容var cols=parseInt(文档。getelementsbyname(' delcols 1 ')[0].值);//检查是否可靠if(isNaN(cols)){ alert('输入不正确。请输入要输出的列。');返回；} if(！(cols=1 colstab。行[0]。细胞。length)){ alert('您要删除的行不存在！');返回；} for(var x=0；xtab。行。长度；x ){//所有的行选项卡。第[x]行.删除单元格(cols-1)；} }/脚本/头体行：输入类型="文本"名称="第1行"/列：输入类型=' text '名称=' cols 1 '/输入类型=' button '值='创建表格onclick=' create table()'/br/input type=' text ' name=' delrow 1 '/input type=' button ' value='删除行onclick=' delRow()'/br/input type=' text ' name=' delcols 1 '/input type=' button ' value='删除列onclick=' DelColS()'/br div id=' div 1 '/div/body/html效果演示：

以上就是为大家分享的两种Java脚本语言动态创建桌子表格的方法，希望大家喜欢。