码迷,mamicode.com
首页 > 其他好文 > 详细

创建一个新的DOM节点

时间:2017-04-12 03:56:10      阅读:147      评论:0      收藏:0      [点我收藏+]

标签:body   utf-8   highlight   添加   title   var   nod   order   存在   

1.appendChild(node)方法

           是将新的元素当做子元素添加到已存在的元素中,并且是父元素中的最后一个子元素。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>

<body>
<div id="div1">
<p id="p1">这是一个段落</p>
</div>
<script>
var para=document.createElement("p"); //首先创建一个元素
var txt=document.createTextNode("这又是一个段落"); //再创建一个文本节点
para.appendChild(txt);//往这元素后边添加这个文本节点,就是让这个p标签里有字
var x=document.getElementById("div1"); //找到现在有的元素,就是要加在哪个元素后边
x.appendChild(para);//往id=“div1”的块元素内加新建的节点
</script>
</body>
</html>
  

  2.inserBefore(newnode,extingnode)方法

                 可将新建节点插入到某个子节点前边,extingnode可选,即要在哪个已存在的节点前添加新建节点,若不写则默认将新节点插在尾部。

//前面部分都不变,
var element=document.getElementById("div1"); var child=document.getElementById("p1"); element.insertBefore(para,child);

  

newnode,existingnode

创建一个新的DOM节点

标签:body   utf-8   highlight   添加   title   var   nod   order   存在   

原文地址:http://www.cnblogs.com/yogi/p/6696483.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!