在使用childNodes时,发现需要删除的元素多于1时,会出现无法全部删除的情况。谷歌以后发现,该属性返回的子节点集合是实时更新的,也就是说,在for循环中,当删除第一个子节点之后,第二次删除的是原子节点集合中的第三个元素。故需要删除全部子节点时,使用

while(node.childNodes.length>0){
    node.removeChild(node.childNodes[0]);
}

在MDN中查了一下,childNodes返回的是NodeList对象,该NodeList对象是实时更新的(有些NodeList对象不是实时更新的),所以才会引起上述现象。

关于childNodes的删除的更多相关文章

  1. Javascript进阶篇——(DOM—节点---插入、删除和替换元素、创建元素、创建文本节点)—笔记整理

    插入节点appendChild()在指定节点的最后一个子节点列表之后添加一个新的子节点.语法: appendChild(newnode) //参数: //newnode:指定追加的节点. 为ul添加一 ...

  2. 点击页面上的元素,页面删除removeChild()

    简单描述:最近做了一个图片上传,上传完成回显图片的时候,需要用到点击图片,从页面删除的效果,然后就找到了removeChild()方法,说实话,我刚看到的时候,就觉得这个问题已经解决了,但是却发现这个 ...

  3. html5中JavaScript删除全部节点

    如果div里有这么些内容: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type ...

  4. div节点的操作(添加,删除,替换,克隆)

    <html> <head> <title></title> <style type="text/css"> div{ b ...

  5. dom 节点篇 ---单体模式

    <script> var creatTag={ oUl:document.createElement('ul'), oDiv:document.createElement('div'), ...

  6. dom 节点篇---模块

    改写成如下代码: var creatTag=(function(){ //var count=5; var oUl=document.createElement('ul'); var oDiv=doc ...

  7. dom 节点篇

    1,创建元素 document.createElement('要创建的元素名'); 2.插入节点 appendChild 和insertBefore 3.删除节点 removeChild  用法 re ...

  8. JS 初级 二(接上)

    传送门--http://www.cnblogs.com/Sabo-dudu/p/5786683.html (一) 六. JS 数组类型 数组是一种保存数据的有序列表,数组的每一项可以保存人意类型的数据 ...

  9. DOM节点属性

    节点属性 在文档对象模型 (DOM) 中,每个节点都是一个对象.DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeType ...

随机推荐

  1. 【Angular专题】 (3)装饰器decorator,一块语法糖

    目录 一. Decorator装饰器 二. Typescript中的装饰器 2.1 类装饰器 2.2 方法装饰器 2.3 访问器装饰器 2.4 属性装饰器 2.5 参数装饰器 三. 用ES5代码模拟装 ...

  2. Android项目刮刮奖详解(三)

    Android项目刮刮奖详解(二) 前言 上一期我们已经实现了一个简易的刮刮卡功能,这一期我们来将其完善一下 目标 将刮刮奖的宽高改为合适高度 将刮刮奖位置居中 将信息层的图片换成文字(重点) 实现 ...

  3. alfs学习笔记-自动化构建lfs系统

    我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! 一名linux爱好者,记录构建Linux From Scratch的过程 经博客园-骏马金龙前辈介绍,开始接触学习lfs,用博客 ...

  4. Dynamics CRM项目实例之八:CRM 2015的产品系列,克隆,修订

    关注本人微信和易信公众号: 微软动态CRM专家罗勇,回复139或者20150106可方便获取本文,同时可以在第一时间得到我发布的最新的博文信息,follow me!       今天的博客主要是关于D ...

  5. NLP&深度学习:近期趋势概述

    NLP&深度学习:近期趋势概述 摘要:当NLP遇上深度学习,到底发生了什么样的变化呢? 在最近发表的论文中,Young及其同事汇总了基于深度学习的自然语言处理(NLP)系统和应用程序的一些最新 ...

  6. arcgis api 3.x for js 入门开发系列四地图查询(附源码下载)

    前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...

  7. 虚拟主机、VPS主机与云服务器的区别

    本文转载自星光云 http://www.365yun.top/news/list.asp?newsid=22 虚拟主机是利用虚拟技术将一台物理服务器划分成多个“虚拟”服务器,虚拟主机的出现大大节省了服 ...

  8. linux命令df中df -h和df -i

    df 命令: linux中df命令的功能是用来检查linux服务器的文件系统的磁盘空间占用情况.可以利用该命令来获取硬盘被占用了多少空间,目前还剩下多少空间等信息. 1.命令格式: df [选项] [ ...

  9. SpringBoot集成mybatis配置

    一个有趣的现象:传统企业大都喜欢使用hibernate,互联网行业通常使用mybatis:之所以出现这个问题感觉与对应的业务有关,比方说,互联网的业务更加的复杂,更加需要进行灵活性的处理,所以myba ...

  10. js实现表格无缝滚动效果

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...