var node=obj.parentNode.parentNode; 這個 parentNode 訪問父節點的問題
<!DOCTYPE?html> <html> ?<head> ??<title>?new?document?</title>?? ??<meta?http-equiv="Content-Type"?content="text/html;?charset=gbk"/>??? ??<script?type="text/javascript">? ?? ??????window.onload?=?function(){ ?????????????????? ?????//?鼠標移動改變背景,可以通過給每行綁定鼠標移上事件和鼠標移除事件來改變所在行背景色。 ?????????var?tr=document.getElementsByTagName("tr"); ?????????for(var?i=0;i<tr.length;i++) ?????????{ ?????????????bgchange(tr[i]); ?????????} ?} ?????function?bgchange(obj) ?????{ ?????????obj.onmouseover=function(){ ?????????????obj.style.backgroundColor="#f2f2f2";} ?????????obj.onmouseout=function(){ ?????????????obj.style.backgroundColor="#fff"; ?????} ?????} ??????//?編寫一個函數,供添加按鈕調用,動態在表格的最后一行添加子節點; ??????var?i=3; ?????function?add() ?????{ ?????????var?table=document.getElementById("table"); ?????????var?node=document.createElement("tr"); ?????????var?th1=document.createElement("th"); ????????? ?????????th1.innerHTML="xh00"+i;? ?????????var?th2=document.createElement("th"); ?????????th2.innerHTML="第"+i+"個"; ?????????var?th3=document.createElement("th"); ?????????th3.innerHTML="<a?href='javascript:;'?onclick='del(this)'>刪除</a>" ?????????i++; ????????node.appendChild(th1); ?????????node.appendChild(th2); ??????????node.appendChild(th3); ?????????table.appendChild(node) ?????????} ???? ??? ? ?????//?創建刪除函數 ?????function?del(obj) ?????{ ?????????var?node=obj.parentNode.parentNode; ?????????node.parentNode.removeChild(node); ?????} ??</script>? ?</head>? ?<body>? ???<table?border="1"?width="50%"?id="table"> ???<tr> <th>學號</th> <th>姓名</th> <th>操作</th> ???</tr>?? ???<tr> <td>xh001</td> <td>王小明</td> <td><a?href="javascript:;"?onclick="del(this)"?>刪除</a></td>???<!--在刪除按鈕上添加點擊事件??--> ???</tr> ???<tr> <td>xh002</td> <td>劉小芳</td> <td><a?href="javascript:;"onclick="del(this)"??>刪除</a></td>???<!--在刪除按鈕上添加點擊事件??--> ???</tr>?? ???</table> ???<input?type="button"?value="添加一行"?onclick="add()"?/>???<!--在添加按鈕上添加點擊事件??--> ?</body> </html>
為什么有兩個訪問父節點,?
var node=obj.parentNode.parentNode;
? ? ? ? node.parentNode.removeChild(node); ? 這兩句代碼 ?訪問父節點,暈了。
2015-02-02
this是a 父節點是td 祖父節點是tr