Javascript removeChild()删除节点及删除子节点的方法
作者:mrr 发布时间:2023-07-02 05:30:22
标签:js,removechild
下面给大家介绍Javascript removeChild()删除节点的方法,具体详情如下所示:
在Javascript中,只提供了一种删除节点的方法:removeChild()。
removeChild() 方法用来删除父节点的一个子节点。
语法:
parent.removeChild(thisNode)
参数说明:
参数 | 说明 |
---|---|
thisNode | 当前节点,即要删除的节点 |
parent | 当前节点的父节点,即 thisNode.parentNode |
例如,删除 id="demo" 的节点的语句为:
var thisNode=document.getElementById("demo");
thisNode.parentNode.removeNode(thisNode);
举例,删除节点:
<div id="demo">
<div id="thisNode">点击删除我</div>
</div>
<script type="text/javascript">
document.getElementById("thisNode").onclick=function(){
this.parentNode.removeChild(this);
}
</script>
实例演示:
可以看出来,虽然Javascript只提供了一种删除节点的方法,但是足够用了。
ps:JavaScript删除子节点的方法
HTML代码如下:
<div id="f">
<div>a</div>
<div>b</div>
<div>c</div>
</div>
如果想删除f节点下的所有子节点,很自然也很正常想到的方法应该就是下面的这段代码了:
var f = document.getElementById("f");
var childs = f.childNodes;
for(var i = 0; i < childs.length; i++) {
alert(childs[i].nodeName);
f.removeChild(childs[i]);
}
当程序运行后我们发现无论在FireFox还是在IE下,均不能完全的删除所有的子节点(FireFox中把空白区域也
当成节点,所以删除结点的结果会不一样的),这是因为当你把索引为0的子节点删除后那么很自然的原来索引
为1节点此时它的索引变成0了,而这时变量i已经变成1了,程序继续走时就会删除原先索引为2的现在为1的节点,这样程序运行的结果就是只删除了一半的子节点,用for in遍历结果也是一样的。想正常的删除全部节点
的话,我们应该从后面往前删除,代码如下:
for(var i = childs.length - 1; i >= 0; i--) {
alert(childs[i].nodeName);
f.removeChild(childs[i]);
}
我们从索引最大值开始删除,采用递减的方法,这样索引便不会移动改变了。
0
投稿
猜你喜欢
- 版本Sublime Text v4.0(4143) 所需软件Sublime Text v4.0(4143)下载地址:https://www.
- 一个重要的应用就是如何在遗忘root用户密码的时候修改密码,使用的方法是启动MySQL服务器时忽略加载授权表。由MySQL使用用户名和口令的
- 如下所示:#!/usr/bin/env python# -*- coding:utf-8 -*-import datetimetime_de
- eclipse安装Python插件之后,主要是为了方便Python代码就可以再Eclipse进行代码脚本,使用Eclipse开发Python
- 来,考考大家一个问题,在 MySQL 中当某一列设置为 int(0) 时会发生什么 ?为了演示这个问题,我们先要创建一个表DROP TABL
- 前言:Unittest又名单元测试,主要用于测试自己写的代码的正确性和完备性,也方便自己和他人对代码的维护。在软件开发过程中,测试驱动开发的
- 有的小伙伴对于枚举的理解很模糊,其实我们可以把它看成一个数量的大管家,对其中的每一个数进行检查,保证里面的数字都没有重复的,这就是枚举的用法
- 最近在代码评审的过程,发现挺多错误使用eval导致代码注入的问题,比较典型的就是把eval当解析dict使用,有的就是简单的使用eval,有
- 大家都知道,数据库的安全性是很重要的,它直接影响到数据库的广泛应用。用户可以采用任意一种方法来保护数据库应用程序,也可以将几种方法结合起来使
- 自己写的小工具,可以直接获取csdn文章并转换为markdown格式效果图核心代码from PySide2.QtWidgets import
- 参考的一些文章以及论文我都会给大家分享出来 —— 链接就贴在原文,论文我上传到资源中去,大家可以免费下载学习,如果当天资源区找不到论文,那就
- 本文实例讲述了wxPython使用系统剪切板的方法。分享给大家供大家参考。具体如下:程序运行效果如下图所示:主要代码如下:import wx
- PHP+MySQL的组合是构建网站的一个常见搭配,不过如何使用PHP通过Web访问MySQL数据库呢?下面从Web数据库架构的工作原理讲起。
- 之前一直在写有关scrapy爬虫的事情,今天我们看看使用scrapy如何把爬到的数据放在MySQL数据库中保存。有关python操作MySQ
- 由于sqlserver的设计特殊性,一般大量数据一般都是采用水平分表,而垂直分表只是把text、图片都较大数据放到单独的表中,这样数据设计会
- 一个可能你似曾相识的场景阅读内容包含大量英文的 PPT、Word、Excel 或者记事本时,由于英语不熟悉,为了流利地阅读,需要打开浏览器进
- 前言django wsgi python有个自带的wsgi模块 可以写自定义web框架 用wsgi在内部创建socket对象就可以了 自己只
- 打开cmder1.移动到D盘输入命令:D:2.创建文件夹λ mkdir myApp3.创建python自带的虚拟环境λ python -m
- 机器学习可应用在各个方面,本篇将在系统性进入机器学习方向前,初步认识机器学习,利用线性回归预测波士顿房价;原理简介利用线性回归最简单的形式预
- 由 于数据库日志增长被设置为“无限制”,所以时间一长日志文件必然会很大,一个400G的数据库居然有600G的LOG文件,严重占用了磁盘空间。