这篇文章介绍了js添加table的行和列 具体实现方法有需要的朋友可以参考一下
代码如下
<!DOCTYPE html PUBLIC //WC//DTD XHTML Transitional//EN transitionaldtd>
<html xmlns=>
<head>
<title></title>
<script language=javascript type=text/javascript>
function addRow() {
var newTR = documentgetElementById(testTable)insertRow(documentgetElementById(testTable)rowslength);
var newNameTD = newTRinsertCell();
newNameTDinnerHTML = aa;
var newNameTD = newTRinsertCell();
newNameTDinnerHTML = <input name=LastName id=LastName type=text />;
var newNameTD = newTRinsertCell();
newNameTDinnerHTML = <input name=BirthDay id=BirthDay type=text />;
var newNameTD = newTRinsertCell();
newNameTDinnerHTML = <input name=age id=age type=text />;
}
function insertRow() {
var oTable = documentgetElementById(table_info);
var oTr = oTableinsertRow();
var oTd = oTrinsertCell();
oTdinnerHTML = 新添加了一行;
}
function insertRow() {
//获取table对象
var table = documentgetElementById(table_info);
//找到要添加button的td这里以表格第一行第一列为例子
var oTd = tablerows[]cells[];
//添加button到td中添加前吧td内容清空并赋予button的代码
oTdinnerHTML = <button onclick=insertRow()>添加收费</button>;
}
function insertRow() {
var oTable = documentgetElementById(table_info);
var oTr = oTableinsertRow();
var oTd = oTrinsertCell();
oTdinnerHTML = 新添加了一行;
}
function insertRow() {
//获取table对象
var table = documentgetElementById(table_info);
//找到要添加button的td这里以表格第一行第一列为例子
var oTd = tablerows[]insertCell();
oTdinnerHTML = &nbps;;
}
function tableDiv() {
var maxRow = ;
var maxCol = ;
var strTbody = [<table border=><tbody>];
for (var i = ; i < maxRow; i++) {
strTbodypush(<tr>);
for (var j = ; j < maxCol; j++) {
strTbodypush(<td>test</td>);
}
strTbodypush(</tr>);
}
strTbodypush(</tbody></table>);
var obj = documentgetElementById(tableDiv);
objinnerHTML = strTbodyjoin();
}
function init() {
var _table _tbody tr td text maxRow maxCol;
var docBody = documentbody;
var _doc = document;
maxRow = ;
maxCol = ;
_table = _doccreateElement(table);
_tableborder = ;
_tablestyletableLayout = fixed;
_tbody = _doccreateElement(tbody);
_tableinsertBefore(_tbody null);
docBodyinsertBefore(_table null);
for (var i = ; i < maxRow; i++) {
tr = _doccreateElement(tr);
_tbodyinsertBefore(tr null);
for (var j = ; j < maxCol; j++) {
td = _doccreateElement(td);
text = _doccreateTextNode(Text);
tdinsertBefore(text null);
trinsertBefore(td null);
}
}
}
</script>
</head>
<body>
<div>
<table id=testTable border= cellspacing=>
<tr>
<th>
FirstName
</th>
<th>
LastName
</th>
<th>
BirthDay
</th>
<th>
age
</th>
</tr>
<tr>
<td>
Jim
</td>
<td>
Green
</td>
<td>
LA
</td>
<td>
</td>
</tr>
<tr>
<td>
Andrew
</td>
<td>
Hou
</td>
<td>
Xian
</td>
<td>
</td>
</tr>
</table>
<input type=button id=aaa value=+add new Row onclick=addRow(); />
</div>
<br />
<hr />
<br />
<div>
<input type=button value=按钮添加行 onclick=insertRow(); />
<table id=table_info border=>
<tr>
<th>
Name
</th>
<th>
Age
</th>
</tr>
</table>
</div>
<br />
<hr />
<br />
<div>
<input type=button value=按钮中添加行 onclick=insertRow(); />
<table id=table_info border=>
<tr>
<th>
Name
</th>
<th>
Age
</th>
</tr>
</table>
</div>
<br />
<hr />
<br />
<div>
<input type=button value=连续添加列 onclick=insertRow(); />
<table id=table_info border=>
<tr>
<th>
Name
</th>
<th>
Age
</th>
</tr>
</table>
</div>
<br />
<hr />
<br />
<div>
<input type=button value=添加一个table onclick=tableDiv(); />
<div id=tableDiv />
</div>
<br />
<hr />
<br />
<div>
<input type=button value=连续添加table onclick=init(); />
</div>
</body>
</html>
【责编:at】
