為什么使用了3次appendChild,結(jié)果卻只創(chuàng)建了1個(gè)子節(jié)點(diǎn)?
<!DOCTYPE html>
<html>
?<head>
? <title> new document </title> ?
? <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> ??
? <script type="text/javascript">?
??
? ? ?
? ? ? // 編寫一個(gè)函數(shù),供添加按鈕調(diào)用,動(dòng)態(tài)在表格的最后一行添加子節(jié)點(diǎn);
? ? function append(){
? ? ?var newtr=document.createElement("tr");
? ? ?var newtd=document.createElement("td");
? ? ?newtd.innerHTML="table";
? ? ?newtr.appendChild(newtd);
? ? ?newtr.appendChild(newtd);
? ? ?newtr.appendChild(newtd);
? ? ?document.getElementsByTagName("table")[0].appendChild(newtr);
? ? ? ??
? ? }
? </script>?
?</head>?
?<body>?
? <table border="1" width="50%" id="table">
? <tr>
<th>學(xué)號(hào)</th>
<th>姓名</th>
<th>操作</th>
? </tr> ?
? <tr>
<td>xh001</td>
<td>王小明</td>
<td><a href="javascript:void();" onclick="remove(this)">刪除</a></td> ? <!--在刪除按鈕上添加點(diǎn)擊事件 ?-->
? </tr>
? <tr>
<td>xh002</td>
<td>劉小芳</td>
<td><a href="javascript:void();" onclick="remove(this)">刪除</a></td> ? <!--在刪除按鈕上添加點(diǎn)擊事件 ?-->
? </tr> ?
? </table>
? <input type="button" value="添加一行" onclick="append()" /> ? <!--在添加按鈕上添加點(diǎn)擊事件 ?-->
?</body>
</html>
如上,使用了3次appendChild,實(shí)際運(yùn)行點(diǎn)擊時(shí),卻只創(chuàng)建了1個(gè)子節(jié)點(diǎn):
2017-07-20
你三次添加的單元格都是同一個(gè)名字,怎么可能有用,就好比你元素屬性寫三次,那也只有一次有用,先創(chuàng)建三個(gè)不同的td再添加
2020-04-01
每次引用對(duì)象時(shí),其實(shí)都是調(diào)用對(duì)象的內(nèi)存地址,所以在循環(huán)中對(duì)一個(gè)對(duì)象添加多次,其實(shí)都是添加的同一個(gè)對(duì)象的內(nèi)存地址,實(shí)際對(duì)象的數(shù)量并沒(méi)有增加,就好比你對(duì)你女朋友連說(shuō)六次愛(ài)你,不等于就有6個(gè)女朋友吧?所以必須在每次循環(huán)時(shí)都重新創(chuàng)建一個(gè)新的對(duì)象,這樣系統(tǒng)就會(huì)為這個(gè)新對(duì)象分配新的內(nèi)存空間,然后再添加到父元素中才算是真正的添加。
2017-08-24
我也是不明白這個(gè)誒,你現(xiàn)在明白了嗎?
2017-07-17
我理解的是節(jié)點(diǎn)里面是已經(jīng)包括了三個(gè)appendchild了,你說(shuō)只創(chuàng)建了一個(gè)子節(jié)點(diǎn)是怎么看出來(lái)的?
2017-07-17
tr的子節(jié)點(diǎn)是3個(gè)td,tr的的parentnode是table,是哪里不對(duì)呢?你的意思是為什么要重復(fù)寫三個(gè)appendChild?
2017-07-17
<tr>
<td>xh001</td>
<td>王小明</td>
<td><a href="jav
,你看看tr下面是不是有三欄,所以需要插入appendChild就是三個(gè)