JavaScript 删除Dom节点

大家好，今天我们来分享一下JavaScript 删除Dom节点

在JavaScript当中，删除节点的步骤：

先获取到父节点，再通过父节点来删除自己（子节点）

这里，提醒一下，自己不可以删除自己

看源码：


```bash
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><div id="father">
<h1>标题1</h1>
<p id="p1">p1</p>
<p class="p2">p2</p>
</div>
<script>var  h1= document.getElementsByClassName('h1');var  p1= document.getElementById('p1');var  p2= document.getElementsByClassName('p2');var father =document.getElementById('father');var childrens =father.children;    //获取父节点下的所有子节点// father.firstChild// father.lastChild</script>
</body>
</html>

这是我们上次的源码，在这里要将p1 节点删除，我们可以看见，p1是h1的子节点

这是它的网页执行结果：

删除子节点：

看现在的网页：

看p1的父节点

看父级节点的所有子节点

根据下标查找子节点：

截图：

根据下标删除子节点：

这样会报错

这是删除是一个动态的过程，我们第一次根据下标删除子节点，原先的数列就会发生变化

也就是说，删除的过程当中，children会变化的

好了，有关于JavaScript 删除Dom节点就到这里了，谢谢大家

JavaScript 删除Dom节点相关推荐

java dom 获得子元素_在JavaScript中删除DOM节点的所有子元素
我将如何删除JavaScript中DOM节点的所有子元素? 说我有以下(丑陋的)HTML: hello world 我抓住了我想要的节点,如下所示: var myNode = document.get ...
vue 之 ele动态删除dom节点
目录 vue 之 ele动态删除dom节点完全删除子dom节点删除最后一个dom节点 vue 之 ele动态删除dom节点比如上传失败的时候,由于ele之中的dom节点已经加载上去了.这时候需要 ...
JavaScript 插入Dom节点
大家好,今天我们来分享JavaScript 插入Dom节点首先我们要知道, 不管我们对Dom节点进行什么样的操作,都必须先获取这个节点,假如说,这个dom节点是空的,我们可以通过innerHTML就 ...
【JavaScript】DOM节点-创建、插入、删除、替换、克隆节点
文章目录 DOM节点创建节点 1. 创建元素节点 2. 创建文本节点插入节点 1. appendChild() 2. insertBefore() 删除节点 1. removeChilde() 2 ...
javascript删除元素节点
在javascript操作dom树的时候可能会经常遇到增加,删除节点的事情,比如一个输入框后一个增加按钮,一个删除按钮,点击增加就增加个输入框,点击删除就删除对应的输入框.在一些js框架,如Prot ...
【Javascript】 DOM节点
HTML文档中一切都是节点! 整个文档是文档节点: 注释是注释节点: 每一个HTML元素都是一个元素节点: 元素内的文本内容是文本节点: 连元素的每一个属性都是一个属性节点. 看到这些是不是感觉很熟悉 ...
JavaScript增加和删除DOM节点
创建节点 var p = createElement(element); // 创建标签 var text = document.c ...
JavaScript-操作DOM对象-删除dom节点
删除节点删除节点的步骤: 先获取父节点,再通过父节点删除自己 <!DOCTYPE html> <html lang="en"> <head>& ...
Javascript元编程创建DOM节点
在使用javascript创建DOM节点的过程中,难免要使用document.createElement.setAttribute. document.createTextNode等冗长.还有浏览器兼 ...
DOM节点的插入、替换、克隆及删除
插入DOM节点插入内部的尾部: 父节点.appendChild(创建节点) 插入内部的某个前面: 父节点.insertBefore(创建的节点,已知的子节点) 替换DOM节点父节点.replace ...

JavaScript 删除Dom节点

JavaScript 删除Dom节点相关推荐

最新文章

热门文章