                        課程
                    
                        /前端開發
                        
                            /JavaScript
                        
                        /JavaScript進階篇

為什么運行不是一次性清除節點

為什么運行不是一次性清除節點？

小花貓愛吃大臉魚

2016-01-05

源自：JavaScript進階篇 9-14

關注問題我要回答

873

操作

收起

1 回答

努力提升
2016-01-05

這樣寫可以一次性清除

<!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");
??? // 在此完成該函數
??? while(content.childNodes[0]){
??????? content.removeChild(content.childNodes[0]);
??? }
?? ?
?? ?
??? //法一: 一次性清除節點內容
? /*for(var i = 0;i < content.childNodes.length; i++){
??????? if(content.childNodes[i].nodeType != 1){? ?
??????????? continue; ?
??????? } else {
??????????? content.removeChild(content.childNodes[i]);?? ?
??????? }
??? }

??? //法二,一次性清除節點內容
/*? ?
??? for(var i = content.childNodes.length - 1; i >= 0; i--){
??????? var chnode = content.childNodes[i];
??????? content.removeChild(chnode); ?
??? }
*/

? //法三,多次方清除節點內容
/*
??? for(var i = 0;i < content.childNodes.length; i++){
??????? var chnode = content.childNodes[i];
??????? content.removeChild(chnode); ?
??? }
*/
}
</script>

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

</body>
</html>