HTML DOM的创建，删除及替换

2021-05-12 03:28

阅读：500

标签：parent for html insert element strong div 定位 ntb

创建HTML元素

　　document.appendChild()
　　将新元素作为父元素的最后一个子元素进行添加
　　如需向HTML DOM添加新元素，首先必须创建该元素，然后把它追加到已有的元素上

var newElement = document.createElement("p")   //创建新元素p
var newTextNode = document.createTextNode("文本节点")   //创建新文本节点
newElement.appendChild(newTextNode)  //向  元素追加文本节点

var element = document.getElementById("div_id")
element.appendChild(newElement)

　　document.insertBefore()

　　该方法可以在指定位置创建新元素

var newElement=document.createElement("p");
var newTextNode=document.createTextNode("文本节点");
newElement.appendChild(newTextNode);

var element=document.getElementById("div_id");
var child=document.getElementById("p1");
element.insertBefore(newElement,child); //将newElement插入到child节点前

删除HTML元素

　　document.removeChild()

    var parent=document.getElementById("div1");
    var child=document.getElementById("p1");
    parent.removeChild(child);     
    
    /*
    要想删除一个元素必须要通过父元素调用removeChild()方法实现
    如果确定删除的元素但不确定父元素，可通过以下方式实现
    即通过parentNode属性获取父元素，然后再调用removeChild()方法实现
    
    var child=document.getElementById("p1");
    child.parentNode.removeChild(child);
    */

替换HTML元素

　　document.replaceChild()

    var parent=document.getElementById("div1");
    var child=document.getElementById("p1");
    var para=document.createElement("p");
    var node=document.createTextNode("这是一个新的段落。");
    para.appendChild(node);
    parent.replaceChild(para,child);

HTML DOM的创建，删除及替换

标签：parent for html insert element strong div 定位 ntb

原文地址：https://www.cnblogs.com/shiliye/p/12012696.html

上一篇：基于SSH的网站后台建设项目定做

下一篇：Json返回结果为null属性不显示解决

文章来自：搜素材网的编程语言模块，转载请注明文章出处。
文章标题：HTML DOM的创建，删除及替换
文章链接：http://soscw.com/index.php/essay/84513.html

亲，登录后才可以留言！

HTML DOM的创建，删除及替换

评论

热门文章

推荐文章

最新文章

置顶文章