php移除所有子节点,Javascript removeChild()删除节点及删除子节点的方法

下面给大家介绍Javascript removeChild()删除节点的方法，具体详情如下所示：

在Javascript中，只提供了一种删除节点的方法：removeChild()。

removeChild() 方法用来删除父节点的一个子节点。

语法：

parent.removeChild(thisNode)

参数说明：

参数

说明

thisNode

当前节点，即要删除的节点

parent

当前节点的父节点，即 thisNode.parentNode

例如，删除 id="demo" 的节点的语句为：

var thisNode=document.getElementById("demo");

thisNode.parentNode.removeNode(thisNode);

举例，删除节点：

点击删除我

实例演示：

可以看出来，虽然Javascript只提供了一种删除节点的方法，但是足够用了。

ps:JavaScript删除子节点的方法

HTML代码如下：

如果想删除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了，程序继续走时就会删除原先索引为２的现在为1的节点，这样程序运行的结果就是只删除了一半的子节点，用for in遍历结果也是一样的。想正常的删除全部节点

的话，我们应该从后面往前删除，代码如下：

for(var i = childs.length - 1; i >= 0; i--) {

alert(childs[i].nodeName);

f.removeChild(childs[i]);

}

我们从索引最大值开始删除，采用递减的方法，这样索引便不会移动改变了。

php移除所有子节点,Javascript removeChild()删除节点及删除子节点的方法_javascript技巧...相关推荐

html5多张图片滚动播放,javascript+html5实现仿flash滚动播放图片的方法_javascript技巧...
本文实例讲述了javascript+html5实现仿flash滚动播放图片的方法.分享给大家供大家参考.具体如下: html部分: css部分: body{ margin: 0px; padding: ...
jquery中remove()方法移除被选元素，包括所有的文本和子节点
jquery中remove方法移除被选元素,包括所有的文本和子节点定义和用法移除所有的元素移除html中指定id的元素内容定义和用法 remove() 方法移除被选元素,包括所有的文本和子节 ...
mysql 递归查找父节点_MySQL递归查询树状表的子节点、父节点具体实现
简介:mysql5.0.94版本,该版本以及较高级的版本(5.5.6等等)尚未支持循环递归查询,和sqlserver.oracle相比,mysql难于在树状表中层层遍历的子节点.本程序重点参考了下面的 ...
div获取第一个子节点jquery_【antd】Tree组件子节点不完全勾选获取父节点的值
注意⚠️:这篇文章适用于后台返回的树结构比较多的情况下,如果数据比较少的情况下,可以参考我的上一篇文章,操作起来比较简单我们在实际操作tree组件和后台交互的时候一般都是需要将父节点传过去,如图:点 ...
双击treeView的节点时使不展开不折叠子节点
有时候我们对树控件的双击默认操作不太满意,比如我们在双击一有子节点的节点的时候不希望打开或关闭它的子节点而想执行一个特定的操作,这时怎么来写呢,我这里有一个办法可以做到这一点: using Syste ...
elementui tree获取父节点_elementUI 树状图点击子节点获取父节点
权限使用elementUI tree 组件,点击子节点获取对应多级的父节点这是应用的组件 :data="hovePermissData" :default-checked- ke ...
php判断表单修改内容,JavaScript判断用户是否对表单进行了修改的方法_javascript技巧...
本文实例讲述了JavaScript判断用户是否对表单进行了修改的方法.分享给大家供大家参考.具体分析如下: 这段JS代码可以判断出用户是否对表单内容进行了修改,如果修改了表单,并退出浏览器,则会提醒用 ...
php 连续点击事件,javascript设置连续两次点击按钮时间间隔的方法_javascript技巧...
本文实例讲述了javascript设置连续两次点击按钮时间间隔的方法,分享给大家供大家参考.具体实现方法如下: 很多时候我们在实际应用中,可能并不希望按钮联系被不间断的点击,所以要限定一定的时间间隔才 ...
php九九乘法表隔行换色,JavaScript实现99乘法表及隔行变色实例代码_javascript技巧...
项目需求:实现在页面中输出99乘法表.(要求:以每三行为一组,实现隔行变色(颜色为白,红,黄(也可自己定义)),鼠标滑过每一行,行背景颜色变为蓝色,鼠标离开又恢复原来的颜色),隔行变色的效果需要用if ...

php移除所有子节点,Javascript removeChild()删除节点及删除子节点的方法_javascript技巧...

php移除所有子节点,Javascript removeChild()删除节点及删除子节点的方法_javascript技巧...相关推荐

最新文章

热门文章