示例 1 :
创建元素节点
通过createElement 创建一个新的元素节点
接着把该元素节点,通过appendChild加入到另一个元素节点div1中
function add(){
var hr=document.createElement("hr");
var div1 = document.getElementById("d");
div1.appendChild(hr);
}
在div中追加一个hr元素
示例 2 :
创建文本节点
首先创建一个元素节点p (p是p标签,不是随便命名的变量名)
接着通过createTextNode创建一个内容节点text
把text加入到p
再把p加入到div
function add(){
var p=document.createElement("p");
var text = document.createTextNode("这是通过DOM创建出来的
");
p.appendChild(text);
var div1 = document.getElementById("d");
div1.appendChild(p);
}
在div中追加一个p元素
示例 3 :
创建属性节点
首先创建一个元素节点a
接着创建一个内容节点content
把content加入到a
然后通过createAttribute创建一个属性节点 href
设置href的值为http:12306.com
通过setAttributeNode把该属性设置到元素节点a上
最后把a加入到div
function add(){
var a=document.createElement("a");
var content = document.createTextNode("http://12306.com");
a.appendChild(content);
var href = document.createAttribute("href");
href.nodeValue="http://12306.com";
a.setAttributeNode(href);
var div1 = document.getElementById("d");
div1.appendChild(a);
}
在div中追加一个超链
来源:https://www.cnblogs.com/JasperZhao/p/13379088.html