在使用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. python基础1--安装、package、数据类型

    1.下载python 下载地址https://www.python.org/downloads/ 2.Package以及数据类型 自带package和外部package 自带package举例: os ...

  2. Spring中用了哪些设计模式

    1 简单工厂模式 又叫做静态工厂方法(StaticFactory Method)模式,但不属于23种GOF设计模式之一. 简单工厂模式的实质是由一个工厂类根据传入的参数,动态决定应该创建哪一个产品类. ...

  3. Ubuntu18 的超详细常用软件安装

    心血来潮,在笔记本安装了Ubuntu 18 用于日常学习,于是有了下面的安装记录. Gnome-Tweak-Tool gnome-tweak-tool可以打开隐藏的设置,可以详细的对系统进行配置,以及 ...

  4. 2019年10个最受欢迎的JavaScript动画库!

    摘要: 非常炫酷的动画库! 原文:值得看看,2019 年 11 个受欢迎的 JavaScript 动画库! 作者:前端小智 Fundebug经授权转载,版权归原作者所有. 1. Three.js 超过 ...

  5. vue生成二维码插件qrcodejs2

    1.页面 <div id="qrCode" ref="qrCodeDiv"></div> 2.导入插件 import QRCode fr ...

  6. #WEB安全基础 : HTML/CSS | 0x4.1嵌套列表

    如果你认为列表只有ul和ol那你就错了 我要为你展示新的列表 这次只有一个index.html文件 这是它的效果 以下是它的代码 <html> <head> <title ...

  7. NET Core应用中使用缓存

    NET Core应用中使用缓存 .NET Core针对缓存提供了很好的支持 ,我们不仅可以选择将数据缓存在应用进程自身的内存中,还可以采用分布式的形式将缓存数据存储在一个“中心数据库”中.对于分布式缓 ...

  8. C# 发送电子邮件源码片段

    下面代码内容是关于C# 发送电子邮件片段的代码,应该对各位有所用途. using System;using System.Web;using System.Web.Mail;public class ...

  9. 扒一扒EOS的前世今生

    扒一扒EOS的前世今生 EOS是什么?   EOS可以认为是Enterprise Operation System的缩写,即商用的一款分布式区块链操作系统,EOS主要为了解决百万级用户的使用问题,为企 ...

  10. Linux内核高端内存

    Linux内核地址映射模型 x86 CPU采用了段页式地址映射模型.进程代码中的地址为逻辑地址,经过段页式地址映射后,才真正访问物理内存. 段页式机制如下图. Linux内核地址空间划分 通常32位L ...