化拓教育网

全部频道

您的当前位置：首页利用js动态添加删除table行的示例代码_javascript技巧

利用js动态添加删除table行的示例代码_javascript技巧

来源：化拓教育网


如下所示：
代码如下:
//动态添加行
function addRow(){
var table = document.getElementById("tableID");
var newRow = table.insertRow(); //创建新行
var newCell1 = newRow.insertCell(); //创建新单元格
newCell.innerHTML = ""； //单元格内的内容
newCell.setAttribute("align","center"); //设置位置
}

//动态删除行
function deleteRow(){
var rowIndex = event.srcElement.parentElement.parentElement.rowIndex;
var styles = document.getElementById("tableID");
styles.deleteRow(rowIndex);
}


















产品名称

产品数量

产品单价








function addRow(){
//添加行

var newTr = testTbl.insertRow();
//添加列
var newTd0 = newTr.insertCell();
var newTd1 = newTr.insertCell();
var newTd2 = newTr.insertCell();
var newTd3 = newTr.insertCell();
//设置列内容和属性

newTd0.innerText = document.all("a").options[document.all("a").selectedIndex].text;
newTd1.innerText = document.all("b").value;
newTd2.innerText = document.all("c").value;
newTd3.innerHTML= '';
}
function del(o)
{
var t=document.getElementById('testTbl');
t.deleteRow(o.parentNode.parentNode.rowIndex)
}



显示全文