`

dom文档节点操作-删除removeChild()

 
阅读更多
<div id="div1" style="height:100px;width:300px;border:1px solid black;">测试
    <p>wjy</p>
</div>

parentNode--removeChild常被用来改变文档的结构
firstChild   lastChild-.nodeValue访问某个元素的文本
var node = document.getElementsByTagName("div")[0];
//alert(node.innerHTML);
while (node.firstChild) { //循环输出子节点,没有第一个子节点时退出循环
    var n = node.firstChild; //获取div第一个子节点
    alert("第一个节点是:"+n.nodeValue);
    n.parentNode.removeChild(n); //获取对应父节点并且删除他的子节点   
    alert("删除后"+n.nodeValue);
}
    alert(node.nodeValue);//输出undefined


扩展:同样的道理,通过 jQuery也可以轻松地删除已有的 HTML 元素。
这里有两个jQuery 方法:
remove() - 删除被选元素(及其子元素)
empty() - 从被选元素中删除子元素

$("#div1").remove();
//将div节点删除,页面什么都不显示

$("#div1").empty();
//将div的子元素 测试 p 全部删除

分享到:
评论

相关推荐

    JS实现DOM删除节点操作示例

    本文实例讲述了JS实现DOM删除节点操作。分享给大家供大家参考,具体如下: 一 介绍 删除节点通过使用removeChild()方法来实现。 removeChild()方法用来删除一个子节点。 obj. removeChild(oldChild) oldChild:表示...

    DOM节点删除函数removeChild()用法实例

    本文实例讲述了DOM节点删除函数removeChild()用法。分享给大家供大家参考。具体分析如下: DOM删除一个节点,必须要站在父节点的高度去删除,代码如下: 代码如下:&lt;html&gt; &lt;head&gt; [removed] function t...

    动态操作dom

    动态操作dom方法文/1、document.createElement() 动态创建一个元素标签 //2、appendChild:把创建的标签添加到容器的末尾 // 容器.appendChild(newEle) //3、insertBefore:把创建的标签增加到容器中某一个标签的...

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

    操作DOM节点的方法:removeChild(),移除子节点,那么可以变通一下来实现移除指定的节点,我们可以先去找到要删除节点的父节点,然后在父节点中运用removeChild来移除我们想移除的节点。 function removeElement(_...

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

    下面给大家介绍Javascript removeChild()删除节点的方法,具体详情如下所示: 在Javascript中,只提供了一种删除节点的方法:removeChild()。 removeChild() 方法用来删除父节点的一个子节点。 语法:  parent....

    HTML DOM简介.rar

    目录如下: 1. DOM可以做什么? 2. DOM的结构 3. 访问DOM节点1——getElementById() 4. 访问DOM节点2——getElementsByTagName() ...9. 删除DOM节点——removeChild 10. 添加DOM节点 11. DOM简介总结

    C#操作XML时,对xmlNode增、删、改操作

    可以使用RemoveAll()或RemoveChild()方法删除XML文档中的节点,RemoveAll()方法可以删除所有子节点,而RemoveChild()方法可以删除指定的子节点。 更新节点 可以使用ReplaceChild()方法将新节点替换老节点,也可以...

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

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

    javascript操作XML

    xmlDoc.removeChild objRootsite '删除某个节点 objXml.parseError '错误接受容器 objXml.parseError.errorCode '返回长整型错误代码 objXml.parseError.reason '返回字符串型错误原因 objXml.parseError....

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

    主要介绍了javascript节点操作移出节点removeChild()的使用,需要的朋友可以参考下

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

    js removeChild 障眼法之可能出现的错误,大家看下代码就知道了。

    解决XML节点删除后会留下一个空节点的问题

    很短但是很实用 哈哈

    JavaScript HTML DOM 元素 (节点)新增,编辑,删除操作实例分析

    本文实例讲述了JavaScript HTML DOM 元素 (节点)新增,编辑,删除操作。分享给大家供大家参考,具体如下: createElement,createTextNode,appendChild,insertBefore,removeChild,replaceChild createElement ...

    html5中JavaScript removeChild 删除所有节点

    通过JavaScript可以删除所有节点,本文里主要讨论 removeChild 函数,大家可以看看下面的示例

    JavaScript的removeChild()函数用法详解

    removechild 函数可以删除父元素的指定子元素。 如果此函数删除子节点成功,则返回被删除的节点,否则返回null。 语法结构: fatherObj.removeChild(childrenObj) 参数解释: 1.fatherObj:要删除子元素的元素对象。 2....

Global site tag (gtag.js) - Google Analytics