JavaScript DOM node operation instance Summary (new, delete HTML elements), javascriptdom

JavaScript DOM node operation instance Summary (new, delete HTML elements), javascriptdom

This article describes how to operate JavaScript DOM nodes. We will share this with you for your reference. The details are as follows:

You can use DOM to Create HTML elements or delete existing HTML elements.

(1) New element:

<Script> // create a new <p> element var newEle = document. createElement ("p"); // create a text node var node = document. createTextNode ("this is a new Section created using Javascript. "); // Add the text node to the newly created <p> element newEle. appendChild (node); var div1_ele = document. getElementById ("div1"); // Add the newly created element to the existing element div1_ele.appendChild (newEle); </script>

(2) Deleting HTML elements

<Script> // When deleting an element, you must first obtain its parent element function deleteEle () {var parent = document. getElementById ("div_02"); var child = document. getElementById ("div_02_p2"); parent. removeChild (child);} // use the code to obtain the parent element function deleteEle3 () {var child = document. getElementById ("div_02_p3"); child. parentNode. removeChild (child) ;}</script>

:

Sample Code:

<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">