js removeChild 障眼法 可能出现的错误

有结构:


代码如下:

<ul id="demo">
<li>a</li>
<li>b</li>
<li>c</li>
</ul>

如果运行代码1:


代码如下:

var ul = document.getElementById('demo');
var liList = ul.getElementsByTagName('li');
for (var i = 0; i < = liList.length; i++) {
ul.removeChild(liList[i]);
}

如果和我一样被欺骗了,那么看看正确的代码就明白原因啦!


代码如下:

var ul = document.getElementById('demo');
var liList = ul.getElementsByTagName('li');
var lilength = liList.length;
for (var i = 0; i < lilength; i++) {
ul.removeChild(liList[0]);
}

(0)

相关推荐

  • js使用removeChild方法动态删除div元素

    在做用户查找时 因为要把查找的结果动态加载和显示,所以,那些html元素要由Ajax动态生成.用户打开查找界面时,有系统推荐的用户,而当用户按条件查找后,查找的结果动态加载和显示.所以考虑到用js来搞. 这个for循环就是移除已有的表单.然后根据Ajax请求过来的数据,动态生成新的表单对象.一定要注意j变量从大往小循环,否则,删除div元素后会引起serchResultLenth=serchResult.children.length;长度的变化(这个问题摸索了好久,才搞定,切记) for(va

  • JavaScript的removeChild()函数用法详解

    removechild 函数可以删除父元素的指定子元素. 如果此函数删除子节点成功,则返回被删除的节点,否则返回null. 语法结构: fatherObj.removeChild(childrenObj) 参数解释: 1.fatherObj:要删除子元素的元素对象. 2.childrenObj:要被删除的子元素对象. 特别说明: 在火狐.谷歌和IE8以上浏览器中,空白也算是一个文本节点,但是在IE8和IE8以下浏览器中会忽略空白文本节点,具体可以参阅javascript如何获取元素的子节点和父节

  • js removeChild 方法深入理解

    1. 概述 删除后的节点虽然不在文档树中了,但其实它还在内存中,可以随时再次被添加到别的位置. 当你遍历一个父节点的子节点并进行删除操作时,要注意,children属性是一个只读属性,并且它在子节点变化时会实时更新 // 拿到待删除节点: var self = document.getElementById('to-be-removed'); // 拿到父节点: var parent = self.parentElement; // 删除: var removed = parent.remove

  • JavaScript中removeChild 方法开发示例代码

    1. 概述 删除后的节点虽然不在文档树中了,但其实它还在内存中,可以随时再次被添加到别的位置. 当你遍历一个父节点的子节点并进行删除操作时,要注意,children属性是一个只读属性,并且它在子节点变化时会实时更新 // 拿到待删除节点: var self = document.getElementById('to-be-removed'); // 拿到父节点: var parent = self.parentElement; // 删除: var removed = parent.remove

  • Javascript removeChild()删除节点及删除子节点的方法

    下面给大家介绍Javascript removeChild()删除节点的方法,具体详情如下所示: 在Javascript中,只提供了一种删除节点的方法:removeChild(). removeChild() 方法用来删除父节点的一个子节点. 语法: parent.removeChild(thisNode) 参数说明: 参数 说明 thisNode 当前节点,即要删除的节点 parent 当前节点的父节点,即 thisNode.parentNode 例如,删除 id="demo" 的节

  • javascript移出节点removeChild()使用介绍

    removeChild(a)是用来删除文档中的已有元素 参数a:要移出的节点 复制代码 代码如下: <div id="guoDiv"> <span>1</span> <span>2</span> <span>3</span> </div> var oDiv = document.getElementById("guoDiv"); var firsChild = oDiv.

  • javascript removeChild 导致的内存泄漏

    为得求证,自己写了一个页面来验证怎样内存泄漏.代码如下 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head

  • javascript删除元素节点removeChild()用法实例

    本文实例讲述了javascript删除元素节点removeChild()用法.分享给大家供大家参考.具体分析如下: 操作DOM节点的方法:removeChild(),移除子节点,那么可以变通一下来实现移除指定的节点,我们可以先去找到要删除节点的父节点,然后在父节点中运用removeChild来移除我们想移除的节点. function removeElement(_element){ var _parentElement = _element.parentNode; if(_parentEleme

  • javascript removeChild 使用注意事项

    假如:一段普通的代码: 其中gift_list为一个table的id 复制代码 代码如下: var giftBody = document.getElementById("gift_list").getElementsByTagName("tbody")[0]; var giftTrs = giftBody.getElementsByTagName("tr"); for (var i=0;i<giftTrs.length;i++) { gi

  • js removeChild 障眼法 可能出现的错误

    有结构: 复制代码 代码如下: <ul id="demo"> <li>a</li> <li>b</li> <li>c</li> </ul> 如果运行代码1: 复制代码 代码如下: var ul = document.getElementById('demo'); var liList = ul.getElementsByTagName('li'); for (var i = 0; i <

  • 详解JS中异常与错误处理的正确方法

    目录 简介 1 面向错误编程 1.1 墨菲定律 1.2 先判否 2. js 内置的错误处理 2.1 Error 类 2.2 throw 2.3 try catch 2.4 Promise.catch 3. 错误处理只有一次 总结 简介 首先,这篇文章一定会引起争议,因为对于错误处理从来就没有真正的标准答案,每个人都会有自己的主观意见. 我的理解毕竟也是片面,提出的想法主要是基于个人的经验总结,如果有异议,欢迎交流讨论. 为了能够尽量保持客观,我会将处理思想尽量前置,再围绕处理思想展开. 这样大家

  • JavaScript将DOM事件处理程序封装为event.js 出现的低级错误问题

    将 DOM 0级事件处理程序和DOM2级事件处理程序 IE事件处理程序封装为eventUtil对象,达到跨浏览器的效果.代码如下: var eventUtil = { // 添加事件句柄 addEventHandler:function (element,type,handler) { if (element.addEventListener) { element.addEventListener(type, handler,false); }else if(element.attachEven

  • 总结Node.js中的一些错误类型

    前言 Node.js应用中可能会发生多种类型的错误.如:当出现语法错误或运行时错误时,会触发JavaScript错误:当试图试访问一个不存在或没有访问的文件时,会触发系统错误:除JavaScript错误和系统错误错误外,用户还可以自定义错误. 1. 错误分类 Node.js是一个JavaScript运行时平台,其应用发生错误都是一个Error实例或Error子类的实例. 在Node.js应用中,可能发生的错误有以下4类: 1.标准JavaScript错误,如: <EvalError> : 当调

  • 基于JS实现EOS隐藏错误提示层代码

    废话不多说了,直接给大家贴代码了,具体代码如下所示: //参数为消息提示层对应的对象,通常为表单里的对象 //特别注意:当使用扩展方法里的type=radio或者type=checkbox时,因为当时设置消息提示层的对象为obj.parentElement.parentElement,所以传入的对象也应为其上2级父节点 function hiddenMessageDiv(obj){ var div = obj.Eos_Message; if(div!=null){ //将该对象从消息数组中移除,

  • 简单聊聊Js中的常见错误类型

    目录 前言 JavaScript中的错误类型 Error EvalError RangeError ReferenceError SyntaxError TypeError URIError 总结 前言 js在开发过程经常会遇到各种各样的报错,那么你了解这些错误产生的原因吗?下面跟我一起认识这几种常见的错误类型吧 JavaScript中的错误类型 Error EvalError RangeError ReferenceError SyntaxError TypeError URIError Er

  • javascript 常见的闭包问题的解决办法

    0 1 2 3 4 5 6 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 上段代码本意是在每个div上都加一个事件,即每当点击div时,就显示此div的相应序号.但是运行程序时我们会发现,不论点击那个,只会显示7,这是什么愿因呢.--这就是闭包的问题 原来 在js中,函数中在定义函数,就出现闭包了.此时外层函数中变量是可以在里层函数里利用的,即使外层函数结束.但是当外层中出现循环的时候,如果在里层函数中利用这个循环变量的话,会直接引用这个变量的最终值. 就像上述代码演示的一样. 如

  • JS异步错误捕获的一些事小结

    引入 我们都知道 try catch 无法捕获 setTimeout 异步任务中的错误,那其中的原因是什么.以及异步代码在 js 中是特别常见的,我们该怎么做才比较? 无法捕获的情况 function main() { try { setTimeout(() => { throw new Error('async error') }, 1000) } catch(e) { console.log(e, 'err') console.log('continue...') } } main(); 这

  • nuxt.js写项目时增加错误提示页面操作

    为项目增加错误提示页面,比如后端接口没有数据或接口报错的时候,如果不增加错误提示页面的话,那接口报错的信息就会在页面中显示,这显然不利于用户体验. 实际操作过程中,可能因为各种原因无法显示正确的返回页面,比如本身这篇文章的id不存在,或者网络请求问题,这时候就需要一个错误展示页用来提示用户: nuxt.js官方也有错误提示页面的写法:传送门-> 官方错误提示页面的写法 此项目中的错误提示页面是放在layouts目录中: layouts中的error.vue页面内容为: <template>

随机推荐