删除节点:
任务
试一试,定义clearText()函数,完成节点内容的删除。
1. 删除该节点的内容,先要获取子节点。
2. 然后使用循环遍历每个子节点。
3. 使用removeChild()删除节点。
<!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"); // 在此完成该函数 /* 这里i如果从0开始循环则会出现不能一次删除完成的现象,从最后一个删会一次删除 这是因为chrom浏览器输出的子节点的长度是11(包括了空白的文本节点),从前开始删每次删除一个元素 子元素的长度改变,i增加后是指新的子元素的中的下标 var node = content.childNodes; for(var i=0; i<node.lengthi;i++){ content.removeChild(node[i]); } */ var node = content.childNodes; for(var i=node.length-1;i>=0;i--){ content.removeChild(node[i]); } } </script> <button οnclick="clearText()" οnclick="clearText()">清除节点内容</button> </body> </html>