怎么让JavaScript删除表格中的行?
我想在表格中添加一个超链接aJavaScript:this.parentNode.parentNode.parentNode.removeChild(this.paren...
我想在表格中添加一个超链接a JavaScript:this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);
我的意思是td->tr->table table删除a所在的行行吗?
或者有没有办法把a所在的td旁边这个td的内容删除然再在创建呢 展开
我的意思是td->tr->table table删除a所在的行行吗?
或者有没有办法把a所在的td旁边这个td的内容删除然再在创建呢 展开
展开全部
<html>
<head>
<title>title</title>
<script type="text/javascript">
function delIndex(obj) {
var rowIndex = obj.parentNode.parentNode.rowIndex;//获得行下标
alert(rowIndex);
var tb = document.getElementById("tb");
tb.deleteRow(rowIndex);//删除当前行
add(rowIndex);//在当前行插入一行
}
function add(rowIndex) {
var tb = document.getElementById("tb");
if (rowIndex == "-1") {
rowIndex = tb.rows.length;//默认在末尾插入一行
}
var row = tb.insertRow(rowIndex);//在表格的指定插入一行
var c1 = row.insertCell(0);
c1.innerHTML = "new" + rowIndex;
var c2 = row.insertCell(1);
c2.innerHTML = '<a href="javascript:void(0)" onclick="delIndex(this)">删除</a>';
}
</script>
</head>
<body>
<input type="button" value="添加一行" onclick="add('-1')" ><input type="button" value="删除选中项" onclick="del()" />
<table id="tb">
<tr><td>1</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
<tr><td>2</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
<tr><td>3</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
<tr><td>4</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
<tr><td>5</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
<tr><td>6</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
<tr><td>7</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
</table>
</body>
</html>
<head>
<title>title</title>
<script type="text/javascript">
function delIndex(obj) {
var rowIndex = obj.parentNode.parentNode.rowIndex;//获得行下标
alert(rowIndex);
var tb = document.getElementById("tb");
tb.deleteRow(rowIndex);//删除当前行
add(rowIndex);//在当前行插入一行
}
function add(rowIndex) {
var tb = document.getElementById("tb");
if (rowIndex == "-1") {
rowIndex = tb.rows.length;//默认在末尾插入一行
}
var row = tb.insertRow(rowIndex);//在表格的指定插入一行
var c1 = row.insertCell(0);
c1.innerHTML = "new" + rowIndex;
var c2 = row.insertCell(1);
c2.innerHTML = '<a href="javascript:void(0)" onclick="delIndex(this)">删除</a>';
}
</script>
</head>
<body>
<input type="button" value="添加一行" onclick="add('-1')" ><input type="button" value="删除选中项" onclick="del()" />
<table id="tb">
<tr><td>1</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
<tr><td>2</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
<tr><td>3</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
<tr><td>4</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
<tr><td>5</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
<tr><td>6</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
<tr><td>7</td><td><a href="javascript:void(0)" onclick="delIndex(this)">删除</a></td></tr>
</table>
</body>
</html>
展开全部
this.parentNode ->当前单元格(td)
int cellIndex = this.parentNode.cellIndex 取得当前cell的序号
this.parentNode.parentNode ->当前行(tr)
this.parentNode.parentNode.children[cellIndex] -> 当前的td
this.parentNode.parentNode.children[cellIndex-1] -> 当前td的左边的td(cellIndex = 0 则不存在)
this.parentNode.parentNode.children[cellIndex+1] -> 当前td的右边的td(cellIndex = this.parentNode.parentNode.children.length 则不存在)
通过 this.parentNode.parentNode.children[cellIndex-1].innerHTML = xxx 即可改变 当前td的左边的td的内容。
通过 this.parentNode.parentNode.children[cellIndex+1].innerHTML = xxx 即可改变 当前td的右边的td的内容。
int cellIndex = this.parentNode.cellIndex 取得当前cell的序号
this.parentNode.parentNode ->当前行(tr)
this.parentNode.parentNode.children[cellIndex] -> 当前的td
this.parentNode.parentNode.children[cellIndex-1] -> 当前td的左边的td(cellIndex = 0 则不存在)
this.parentNode.parentNode.children[cellIndex+1] -> 当前td的右边的td(cellIndex = this.parentNode.parentNode.children.length 则不存在)
通过 this.parentNode.parentNode.children[cellIndex-1].innerHTML = xxx 即可改变 当前td的左边的td的内容。
通过 this.parentNode.parentNode.children[cellIndex+1].innerHTML = xxx 即可改变 当前td的右边的td的内容。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询