<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
window.onload=function()
{
var oTab = document.getElementById('tab1');
var oName = document.getElementById('name');
var oAge = document.getElementById('age');
var oBtn = document.getElementById('btn');
var id = oTab.rows.length+1;
oBtn.onclick=function()
{
var oTr = document.createElement('tr');
var oTd = document.createElement('td');
oTd.innerHTML = id++;
oTr.appendChild(oTd);
var oTd = document.createElement('td');
oTd.innerHTML =oName.value;
oTr.appendChild(oTd);
var oTd = document.createElement('td');
oTd.innerHTML = oAge.value ;
oTr.appendChild(oTd);
var oTd = document.createElement('td');
oTd.innerHTML = "<a href='javascript:'>刪除</a>" ;
oTr.appendChild(oTd);
oTd.getElementsByTagName('a')[0].onclick=function()
{
oTab.tBodies[0].removeChild(this.parentNode.parentNode);
}
oTab.tBodies[0].appendChild(oTr);
}
}
</script>
</head>
<body>
姓名：<input id="name" type="text" />
班級：<input id="age" type="text" />
<input id="btn" type="button" value='添加' />
<table id="tab1" border="1px" width="600px">
<tHead>
<td>1</td>
<td>2</td>
<td>3</td>
<td>操作</td>
</tHead>
<tbody>
<tr>
<td>2</td>
<td>22</td>
<td>33</td>
<td></td>
</tr>
<tr>
<td>3</td>
<td>22</td>
<td>33</td>
<td></td>
</tr>
<tr>
<td>4</td>
<td>22</td>
<td>33</td>
<td></td>
</tr>
</tbody>
</table>
</body>
</html>
這個實現(xiàn)效果是一個表格中，最后一列添加刪除的效果，我搞不懂，createElement創(chuàng)建了a標簽添加刪除功能之后，為什么 oTd.getElementsByTagName('a')[0].onclick=function() 這里面TagName選的是[0]，不是每一次都會創(chuàng)建一個a標簽來觸發(fā)js么。 為什么不是做個for循環(huán)給每個a來加onclick
4
0
0
這是慕課網(wǎng)上JS的課程吧 'oTd'本來就是 oBtn.onclick之后才會創(chuàng)建的元素 這里面的a元素當(dāng)然也是新建的;
為何還總是要用[0]? 因為getElementsTagName('a')返回的是一個元素list 即使長度只有1 也要用[0]或者.item(0)來拿到這個DOM元素
通過你的代碼可知，此時的oTd是用來存放刪除鏈接的td元素，設(shè)置完innerHTML屬性之后，此時的td元素為<td><a href='javascript:'>刪除</a></td>；<td><a href='javascript:'>刪除</a></td>；oTd.getElementsByTagName('a')的返回值是該td元素（限定了選擇范圍，就是從包含這個a元素的父元素td中選擇，而不是table元素）中包含的a元素組成的數(shù)組，因為該td元素只包含一個a元素，所以結(jié)果是長度為1的數(shù)組，要獲取這個a元素，當(dāng)然是取結(jié)果的[0]oTd.getElementsByTagName('a')的返回值是該td元素（限定了選擇范圍，就是從包含這個a元素的父元素td中選擇，而不是table元素）中包含的a元素組成的數(shù)組，因為該td元素只包含一個a元素，所以結(jié)果是長度為1的數(shù)組，要獲取這個a元素，當(dāng)然是取結(jié)果的[0]了（數(shù)組下標從0開始）；
可以用一個for循環(huán)來添加onclick事件，你可以在每次執(zhí)行完oTab.tBodies[0].appendChild(oTr);語句后，使用
var aArray = oTab.getElementsByTagName("a");
for (var i = 0; i < aArray.length; i++) {
aArray[i].onclick = function() {
oTab.tBodies[0].removeChild(this.parentNode.parentNode);
}
}但是問題是，你在第一個點擊添加的時候，給第一條添加信息的a元素注冊了點擊事件；當(dāng)你第二次點擊添加的時候，因為第一條信息已經(jīng)有點擊事件了，為什么還要再覆蓋一次點擊事件呢？你只需要給新添加的元素注冊點擊事件就可以了啊。
