亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全，請及時綁定郵箱和手機立即綁定

怎么點擊第一下沒有反應，然后再點擊一下刪除了3個，然后再點擊依次刪除一個

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>無標題文檔</title>

</head>

<body>

<div id="content">

? <h1>html</h1>

? <h1>php</h1>

? <h1>javascript</h1>

? <h1>jquery</h1>

? <h1>java</h1>

</div>

<script type="text/javascript">

function clearText() {

? var content=document.getElementById("content");

? for(i=0;i<content.childNodes.length;i++)

? {

? ? ? var x=content.removeChild(content.childNodes[i]);

? ? ? x=null;

? }

}

</script>

<button onclick="clearText()">清除節點內容</button>


正在回答

47 回答

自己編就想不到這么多==

0 回復 有任何疑惑可以回復我~

唔，我也遇到這個問題，看到結尾，我懂了，謝謝。

0 回復 有任何疑惑可以回復我~

有意思，子節點數組的長度是動態變化的，那看來DOM操作很耗內存資源吧？

1 回復 有任何疑惑可以回復我~

這段代碼是個變值，沒循環一次，都會-1

content.childNodes.length


5 回復 有任何疑惑可以回復我~

該任務，要注意一些問題

1. 瀏覽器兼容問題。

<div?id="content">
??<h1>html</h1>
??<h1>php</h1>
??<h1>javascript</h1>
??<h1>jquery</h1>
??<h1>java</h1>
</div>

content孩子節點:

ie下是5個節點，chrome等瀏覽器是11個節點（因為出現了空白節點，如忘記了可以看看9-11節）。

2. 不管你使用正序還是倒序刪除節點，要注意在刪除節點同時，content孩子節點的個數和位置也在變化。所以最好刪除時正序總刪除第一個，倒序總刪除最后一個。

3.? 可以使用for或while 循環，使用for循環時注意。

function?clearText()?{
??var?content=document.getElementById("content");
??for(i=0;i<content.childNodes.length;i++)
??{
??????var?x=content.removeChild(content.childNodes[i]);
??}
}

不要把i<content.childNodes.length做為判斷條件，舉例說明，IE下執行，節點個數5個，當我點一次刪除按鈕。

注意:5個節點分別對應下標是從0開始:??? 1[0]???????? 2[0]???????? 3[0]?????????? 4[0]????????? 5[0]?

i=0?????content.childNodes.length=5????? 0<5? 刪除第一個節點后，繼續循環

i=1?????content.childNodes.length=4????? 1<4?? 刪除第二個節點后，繼續循環

i=2?????content.childNodes.length=3?????? 2<3? ?刪除第三個節點后，繼續循環

i=3???content.childNodes.length=2????????? 3<2? 不成立，所以不繼續。

這也就是為什么一次刪除不了所以節點。

可以把上面的代碼修改下:

?function?clearText()?{??

?var?content=document.getElementById("content");

??nodel=content.childNodes.length

??for(i=0;i<nodel;i++)??{??

??????var?x=content.removeChild(content.childNodes[0]);??}

???}

378 回復 有任何疑惑可以回復我~
#1

WingMeng

看過后思路頓然明朗，腰不酸了，腿不痛了，coding也有勁了
2014-12-06 回復 有任何疑惑可以回復我~
#2

柳樹

解釋的贊，清晰明了。
2014-12-20 回復 有任何疑惑可以回復我~
#3

折疊幸福

老師 幫忙看下為什么這么寫沒反應 function clearText() { var content=document.getElementById("content"); // 在此完成該函數 for(var i=content.childNodes.length;i<1;i--){ var x=content.removeChild(content.childNodes[i-1]);
2014-12-30 回復 有任何疑惑可以回復我~
#4

pangqianyi 回復 折疊幸福

循環的一開始就沒滿足條件，i<1 改為 i> =0;還有就是i 的賦值在循環的時候是已經給定了，不會經過.length去返回了，這是for 語句循環的步驟
2015-01-02 回復 有任何疑惑可以回復我~
#5

M_S

醍醐灌頂
2015-01-16 回復 有任何疑惑可以回復我~
#6

zhangxinxin

老師分析的好透徹，完全就知道我們在哪里陣亡
2015-01-16 回復 有任何疑惑可以回復我~
#7

網頁設計學習者

回答得太棒了。
2015-01-22 回復 有任何疑惑可以回復我~
#8

maccine

老師，為什么不要把i<content.childNodes.length做為判斷條件?。?/div>
2015-02-06 回復 有任何疑惑可以回復我~
#9

ice_camel

贊，想通了！ 另外請問下刪除返回值可以不賦值嗎？直接content.removeChild(content.childNode[0]); 會不會有什么副作用？
2015-03-27 回復 有任何疑惑可以回復我~
#10

馬小駿mz

理解了，謝謝老師。
2015-04-10 回復 有任何疑惑可以回復我~
#11

你們城里人真會玩

老師太吊了
2015-05-22 回復 有任何疑惑可以回復我~
#12

voice 回復 折疊幸福

for 里面的循環順序錯了
2015-05-30 回復 有任何疑惑可以回復我~
#13

慕的地8442182 回復 折疊幸福

var i=content.childNodes.length;i<1;i--循環條件不對吧？尤其是第二個條件
2015-06-18 回復 有任何疑惑可以回復我~
#14

qq_芒果加冰_0

可是for(i=0;i<nodel;i++) { var x=content.removeChild(content.childNodes[0]); } }為什么循環的數組是content.childNodes[0]而不是content.childNodes[i]
2015-07-14 回復 有任何疑惑可以回復我~
#15

朝夕v8 回復 qq_芒果加冰_0

意思就是這個循環執行時，每次都是刪除div下第一個子節點。
2015-07-17 回復 有任何疑惑可以回復我~
#16

superli18

你那里改過以后將nodel=content.childNodes.length for(i=0;i<nodel;i++) 。。。。。。。 不把content.childNodes的長度不放在循環中，是一直將他的長度不變是嗎？
2015-08-25 回復 有任何疑惑可以回復我~
#17

dingxin

為什么把老師寫的代碼復制過去點擊一下就全部刪除了
2015-08-29 回復 有任何疑惑可以回復我~
#18

零下的夏天 回復 superli18

console了一下，是nodel的長度一直沒變
2015-09-19 回復 有任何疑惑可以回復我~
#19

再去西藏 回復 qq_芒果加冰_0

0代表數組中的第一個元素， 每次刪掉一個第二個元素就成了數組中的第一個，如果用i就會出現老師舉例的情況，就是當i=3，數組長度為二了，這樣就執行不下去了。 我這么說能理解嗎
2015-09-28 回復 有任何疑惑可以回復我~
#20

雨丶辰 回復 折疊幸福

循環變量i的判斷條件應該是i>0吧，如果是i<1，初始的i都不滿足條件肯定不會執行循環了。
2015-10-05 回復 有任何疑惑可以回復我~
#21

hassk

解釋贊一個。頓時豁然開朗呀~~~~~
2015-10-28 回復 有任何疑惑可以回復我~
#22

kkkkkvvv

了解了。。我現在這樣寫 content.removeChild(content.firstChild);
2015-11-17 回復 有任何疑惑可以回復我~
#23

門內的野蠻人

大神，真贊！
2015-12-15 回復 有任何疑惑可以回復我~
#24

Im陳小旭

說的有道理，但是你運行一下我這代碼試試 function clearText() { var content=document.getElementById("content"); // 在此完成該函數 for(var i=0;i < content.childNodes.length-1;i++){ var x = content.removeChild(content.childNodes[i]); document.write("刪除節點:"+content.childNodes[i].innerHTML+"</br>"); } }
2015-12-18 回復 有任何疑惑可以回復我~
#25

慕斯卡4106679

<script type="text/javascript"> function clearText() { var content=document.getElementById("content"); // 在此完成該函數 var a=content.childNodes while(a.length>0){ content.removeChild(a[0]); } } w我這么寫怎么一下就刪光了
2015-12-31 回復 有任何疑惑可以回復我~
#26

really4you 回復 再去西藏

childNodes[0]是數組的第一個元素，但是請問為什么第二個就成了第一個了?是不是所有刪掉的元素都會占用上一個元素的位置？這點沒想通
2016-01-18 回復 有任何疑惑可以回復我~
#27

Leon_tu

果然是大神 敬佩
2016-01-21 回復 有任何疑惑可以回復我~
#28

uwenhao2008

MARK一下，解釋的好詳細哦。謝謝了 思密達~~~~~
2016-01-27 回復 有任何疑惑可以回復我~
#29

橫斷瀟云 回復 折疊幸福

因為每次刪的都是那個空白標簽，所以沒反應。
2016-01-31 回復 有任何疑惑可以回復我~
#30

qq_A_46

那么子節點數組的下標不會改變嗎。
2016-02-04 回復 有任何疑惑可以回復我~
#31

prettywinter 回復 折疊幸福

循環條件寫錯了。 for(var i=content.childNodes.length;i>1;i--)
2016-02-17 回復 有任何疑惑可以回復我~
#32

prettywinter 回復 maccine

每次循環后，length的值會改變
2016-02-17 回復 有任何疑惑可以回復我~
#33

prettywinter 回復 qq_芒果加冰_0

每次刪除的是數組中的第一個元素，刪除元素后，數組中元素的位置會發生改變
2016-02-17 回復 有任何疑惑可以回復我~
#34

prettywinter 回復 superli18

就是這個意思
2016-02-17 回復 有任何疑惑可以回復我~
#35

格勞修斯 回復 qq_芒果加冰_0

因為每循環一次[0]位置的節點都被刪除了
2016-03-02 回復 有任何疑惑可以回復我~
#36

張威1992

為什么要改成0？
2016-03-04 回復 有任何疑惑可以回復我~
#37

Lshah0 回復 折疊幸福

你看老師的解釋。 i=content.childNodes.length 不能使用這個做循環條件， content.removeChild(content.childNodes[i-1]);
2016-03-18 回復 有任何疑惑可以回復我~
#38

紀行川

給你點贊
2016-03-26 回復 有任何疑惑可以回復我~
#39

Richardsh 回復 折疊幸福

i<1改為i>0
2016-04-05 回復 有任何疑惑可以回復我~
#40

不知所語

能解釋一下為什么第一次點擊的時候沒反應嗎
2016-04-11 回復 有任何疑惑可以回復我~
#41

不知所語

還有把代碼改成你給的那樣，還是不能一次性就刪除掉
2016-04-11 回復 有任何疑惑可以回復我~
#42

干枯的海綿 回復 折疊幸福

for循環中起始條件i取值超出范圍，應該是var i=content.childNodes.length-1；
2016-04-13 回復 有任何疑惑可以回復我~
#43

Swibinchter

柳暗花明
2016-04-14 回復 有任何疑惑可以回復我~
#44

qq_沒有美腿的寶馬_0

把for里面的i改成i=1這樣 為什么可以直接刪除所有的
2016-04-19 回復 有任何疑惑可以回復我~
#45

qq_路易十四_0

感覺比此節內容學到的還多，受益了，謝謝答主
2016-05-18 回復 有任何疑惑可以回復我~
#46

夕顏egao 回復 折疊幸福

i<1條件不成立
2016-06-07 回復 有任何疑惑可以回復我~
#47

慕姐8289045

你好，不太理解，第一個問題，就算你的序號2說的，什么正著刪除一個，倒著刪除一個？什么意思？ 第二個問題，序號3我懂了一次性刪除3個，那為啥后兩個是一次刪除一個呢？ 第三個問題，序號3改的代碼是不是var x=content.removeChild(content.childNodes[0]);里面應該是content.childNodes[i],而不是content.childNodes[0]??？、、、、求大神你解答《，，，，，，，，，嘻嘻
2016-07-26 回復 有任何疑惑可以回復我~
#48

小瓶綠芬達

for(var i=0;i<content.childNodes.length;i++){ var x=content.removeChild(content.childNodes[0]); } }為什么結果不一樣
2016-08-08 回復 有任何疑惑可以回復我~
#49

慕慕1265030

解釋的太棒了 簡單明了
2016-08-15 回復 有任何疑惑可以回復我~
#50

這你都曉得 回復 再去西藏

稍微理解了點 但是var x=content.removeChild(content.childNodes[0] 這個是會重復執行的么？
2016-09-01 回復 有任何疑惑可以回復我~
#51

lewandowski

說的好好，謝謝
2016-10-20 回復 有任何疑惑可以回復我~
#52

Delivw

謝謝老師,瞬間明白
2016-11-03 回復 有任何疑惑可以回復我~
#53

qq_在迷宮_0

var childList=content.childNodes; for(var i=0;i<childList.length;i++){ while(childList[i]&&childList[i]!=1){ } content.removeChild(childList[i]); } 如果定義一個變量來接收content.childNodes,那么這個時候childNodes的長度就不會動態變化而是在變量中存著了,但是還是會出現點擊第一下沒有反應，然后再點擊一下刪除了3個，然后再點擊依次刪除一個
2016-11-12 回復 有任何疑惑可以回復我~
#54

蔡華3618527

var x=content.removeChild(content.childNodes[0]); 這里為什么不是i而是0呢，那這個i都沒用用上，循環用來起什么作用呢
2017-01-05 回復 有任何疑惑可以回復我~
#55

移動的城堡上住著小智

茅塞頓開，感謝樓主
2017-03-11 回復 有任何疑惑可以回復我~
#56

斟酒獨酢 回復 折疊幸福

for(var i=content.childNodes.length;i<1;i--) i要大于1，i小于1，怎么循環。
2017-03-11 回復 有任何疑惑可以回復我~
#57

青黃不一

厲害了
2017-03-20 回復 有任何疑惑可以回復我~
#58

Jeoop

謝謝，豁然開朗！
2017-04-23 回復 有任何疑惑可以回復我~
#59

浮若絆笙 回復 折疊幸福

你的循環條件 for(var i=content.childNodes.length;i<1;i--) 應該改成 for(var i=content.childNodes.length; i>=0; i- -) 上面的循環條件 i<1是有問題的
2017-07-25 回復 有任何疑惑可以回復我~
#60

qq_wonderful_6

我有點不明白：為什么Chrome瀏覽器會變11個節點不是10個？
2017-09-20 回復 有任何疑惑可以回復我~
#61

路人戊_

6666666，就是比我們想得多，看到循環就習慣性用那些變量做條件了，根本沒仔細想
2017-11-19 回復 有任何疑惑可以回復我~
#62

NOBOUND0323

回復 再去西藏理解?。?！
2018-01-10 回復 有任何疑惑可以回復我~
#63

qq_巴卡拉_0

老師無敵，厲害，有get到一個點了
2018-03-30 回復 有任何疑惑可以回復我~
查看60條回復

如果用while循環的話，可以這么些，如下：

<script?type="text/javascript">
????function?clearText()?{
????????var?content=document.getElementById("content");
????????while(content.childNodes.length?!=?0){
????????????var?x=content.removeChild(content.childNodes[0]);
????????}
????}
</script>


20 回復 有任何疑惑可以回復我~
#1

maccine

老師，用while循環和for循環function clearText() { var content=document.getElementById("content"); for(i=0;i<content.childNodes.length;i++) { var x=content.removeChild(content.childNodes[i]); } }為什么while可以全部刪完？而for循環只能一次刪除三個呀？
2015-02-06 回復 有任何疑惑可以回復我~
#2

maccine

上面那段代碼復制錯了，是下面這段代碼。求老師幫忙解答一下 function clearText() { var content=document.getElementById("content"); for(i=0;i<content.childNodes.length;i++) { var x=content.removeChild(content.childNodes[0]); } }
2015-02-06 回復 有任何疑惑可以回復我~
#3

qq_三亞旅游攝影_0 回復 maccine

i<content.childNodes.length 第次循環是：2<3 成立 刪除，第4次循環是：3<2 所以就沒然后了
2015-08-23 回復 有任何疑惑可以回復我~
#4

鴨梨同學

這個好像更簡潔
2016-01-07 回復 有任何疑惑可以回復我~
#5

prettywinter 回復 maccine

沒刪除一個節點，數組的長度會改變。
2016-02-17 回復 有任何疑惑可以回復我~
查看2條回復

這個是運算時候的邏輯問題，你寫的循環是從上往下刪除，就會產生這樣一個問題，舉個例子，比如一排人有5個，分別對應1，2，3，4，5，那么這個時候1號有事臨時走了，那么重新排隊，是不是剩下的所有序號都要往前移一位，就是原來的2號是1號，3號是2號以此類推。你寫的這個循環中就有這個問題，就是刪除一次以后再次循環的時候順序就會重新排列，這個時候再刪除的時候就不是刪除以前的節點，而是他的下一個節點了，因此這種寫法，不是最好的，可以參考一下給出的代碼，或者嘗試一下用while語句去寫

9 回復 有任何疑惑可以回復我~
#1

qq_A_46

那樣隨著位置每次的變化，每刪除第一個節點之后，之后的節點又充當第一個節點。那么就只要刪除第一個節點就好了吧。
2016-02-04 回復 有任何疑惑可以回復我~
#2

米蟲懶得聰明 回復 qq_A_46

對的，我認為也是這樣
2016-07-04 回復 有任何疑惑可以回復我~
#3

稻穗陳落入夢來

正解，不過我把for循壞的I換成固定數，還是只能輸出3個
2016-09-27 回復 有任何疑惑可以回復我~
首頁上一頁12345下一頁尾頁

舉報

0/150
提交
取消

怎么點擊第一下沒有反應，然后再點擊一下刪除了3個，然后再點擊依次刪除一個

我要回答 關注問題
微信客服

購課補貼
聯系客服咨詢優惠詳情

 幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

 公眾號

掃描二維碼
關注慕課網微信公眾號