首页 > 代码库 > JavaScript创建节点

JavaScript创建节点

1.JavaScript创建节点

createElement();注:创建元素节点。

例如:

var v = document.createElement("p");

 

createTextNode();注:创建文本节点。

例如:

var v = document.createTextNode("大家好");

2.js节点操作

appendChild();注:给当前节点添加一个子节点

var p = document.createElement("p");

var text = document.createTextNode("大家好");

p.apendChild(text);注:添加

 

removeChild();删除子节点

var div = document.createElement("div");

var p = document.createElement("p");

div.removeChild(p);

 

replaceChild();注:更换子节点

var p = document.createElement("p");

var text = document.createTextNode("大家好");

p.apendChild(text);注:把text添加到p里面

var text1 = document.createTextNode("你们好");

p.apendChild(text1,text);注:这样就把text换成了text1。

 

insertBefore();将一个节点插入另一个节点之前。

var div = document.createElement("div");

var p = document.createElement("p");

div.apendChild(p);注:将p添加到div,这个时候p在div中的位置是第一

var p1 = document.createElement("h1");

div.insertBefore(p,p1);注:这样就把h1放到p的前面,p在div中的位置是第二。

 

2.JavaScript元素内容与属性的操作

innerHTML;获取指定元素的HTML。className;获得指定元素的Class属性。style;获得指定元素的style样式。getAttribute();获得指定元素的属性值。setAttribute();为新元素设置属性。removeAttribute();删除指定元素的属性。

例如;

<div id = "div1">abc<div/>

document.getElementById("div1").innerHTML="cba";

document.getElementById("div1").setAttribute("style","color:#000;");

JavaScript创建节点