在使用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. Spring Cloud Alibaba基础教程:支持的几种服务消费方式(RestTemplate、WebClient、Feign)

    通过<Spring Cloud Alibaba基础教程:使用Nacos实现服务注册与发现>一文的学习,我们已经学会如何使用Nacos来实现服务的注册与发现,同时也介绍如何通过LoadBal ...

  2. Qt显示Linux desktop natification气泡提示框

    在现代Linux桌面环境上我们时常可以看到类似的消息框: 这些消息框常用在如下场景: 即时聊天软件的新消息 闹钟定时提示 电池电量提示 邮件消息 长耗时操作的完成提示 在freedesktop.org ...

  3. Smobiler 4.4 更新预告 Part 1(Smobiler能让你在Visual Studio上开发APP)

    在4.4版本中,大家对产品优化的一些建议和意见进行了相应的优化和修复,同时,还新增了一些令人激动的功能和插件. 下面先为大家介绍4.4版本中Smobiler的优化和修复: 优化 1, PageView ...

  4. 使用DataSet與DataAdapter對數據庫進行操作

    1.定義連接字符串 var source = "server=(local); integrated security=SSPI; database=test"; var conn ...

  5. Windows系统 应用或游戏 打开出现0xc000007b错误 解决方法

    1.使用directX修复工具(推荐) 标准版 增强版 标准版备用地址 增强版备用地址 2. 重新安装DirectX 9.0 安装包(安装包体积大) 微软官方离线安装包 摘录CSDN博客 运行游戏时出 ...

  6. 多线程(2)Thread

    我们先从最基础的Thread说起. 创建并启动线程 创建并启动一个线程,如下代码: namespace ConsoleApplication17 { class Program { static vo ...

  7. 事件绑定on与hover事件

    今天项目中UI设计了一个鼠标划入和划出的效果,本来这个小效果是非常简单的!可是在实际的生产环境中就出现了一点点问题!因为在实际的环境中,数据全部是用ajax异步加载进去的,这样就造成了hover方法不 ...

  8. 41.Odoo产品分析 (四) – 工具板块(10) – 问卷(1)

    查看Odoo产品分析系列--目录 在该模块下,可以创建问卷,收集答案,打印统计.  安装"问卷"模块,首页显示当前各个阶段中的问卷:  打开"开发者模式",能对 ...

  9. Windows7 64位环境6sv2.1大气传输模型修改源码添加国产高分卫星GF-1 GF-2光谱响应支持

    下面开始添加国产卫星光谱响应的支持: 以下主要参考文章“6S大气传输模型修改源码添加.自定义卫星光谱响应(以HJ-1B CCD为例)”网址:http://blog.csdn.net/sam92/art ...

  10. Android TV端的(RecyclerView)水平滚动焦点错乱问题

    package com.hhzt.iptv.ui.customview; import android.content.Context;import android.content.res.Typed ...