JS node operation

# node Operation #

# # Get Node Method # #

var body = document.body; Get directly through elements
var D1 = document.getElementById ("D1"); Get by ID
var PS = document.getelementsbytagname ("P"); Get by element name
var attrs = d1.attributes; Accessing the attributes of an element
Console.log (["Attribute node:", attrs["id"].nodetype]); The node type that accesses the ID element
Console.log (["Access attribute:", d1.id]);
Console.log (["Access attribute:", D1.getattribute ("id")]);
Console.log (["Text node:", Ps[0].firstchild.nodetype]);
Console.log (["Element node:", Body.nodetype]);
Console.log (PS);

Console.log (d1.firstChild.nextSibling.nextSibling.nextSibling.previousSibling);
var nodes = D1.childnodes; Access all child nodes of D1 and get a collection of similar arrays
Console.log (nodes);
Console.log (D1.parentnode);


# # Add Node # #

Addnode.onclick = function () {
var p = document.createelement ("P"); Creating child elements
var text = document.createTextNode ("paragraph"); Create text content for an element
P.appendchild (text); Add text to the created element
Document.body.appendChild (P); To add a child node to the established parent node

}

*d1.childnodes//All Node Collections *

*d1.parentnodes//Parent Node *

# # Insert Node # #

var insertnode = document.getElementById ("Insertnode");
Insertnode.onclick = function () {
var p = document.createelement ("P");
var text = document.createTextNode ("paragraph");
P.appendchild (text);

var D1 = document.getElementById ("D1");
Document.body.insertBefore (P,D1);

Document. The parent node of the insertion node. insertbefore (new insertion stage, inserted node);

}

# # Delete Node # #

var delnode = document.getElementById ("Delnode");
Delnode.onclick = function () {
Document.body.removeChild (Document.body.lastChild);

Document. Removes the parent node of the node. RemoveChild (remove node);;

}

# # Replacement Node # #

var replacenode = document.getElementById ("ReplaceNode");
Replacenode.onclick = function () {
var H1 = document.createelement ("H1");
var text = document.createTextNode ("title");
H1.appendchild (text);
Document.body.replaceChild (H1,document.body.lastchild);

Document. Replace the parent node of the node. ReplaceChild (node replaced, node replaced);

}

* ' d1.innerhtml + = ' <p>innerhtml add </p> '; ' The original content will be replaced by new content, but inefficient *

There are two elements in the *innerhtml that cannot be replaced: TD in 1.table and Tr;2.select in option*

*innertext the contents of "" As is , and can be used in Web pages where the source code is needed to ensure that the label is not parsed *

JS node operation