How to use JavaScript Dom Node appendchild
In this article I have described about Dom Node appendchild() method in JavaScript.
JavaScript Dom Node appendchild() method
- As we already know that node object is used to represent and add node within the HTML document.
- The node within document can be an element, an attribute, a text, a comment and may be a document itself.
- The appendchild() method add a node as a last child of a node or to move an element from one element to another.
Browser support
Following are the main browsers which support the prototype Property of boolean object
- Internet Explorer.
- Firefox.
- Opera.
- Google Chrome.
- Safari.
Syntax
The appendchild() method of Dom Node object has following syntax
node.appendchild(node)
Lets take an example
<!DOCTYPE html>
<html>
<body style ="background-color:yellow">
<ul id="menu"><li>colddrink</li><li>milk</li><li>softdrink</li></ul>
<p id="demo">APPEND THE ITEM TO LIST</p>
<button onclick="myFunction()">APPEND</button>
<script type="text/javascript">
function myFunction()
{
var node = document.createElement("LI");
var textnode = document.createTextNode("milk");
node.appendChild(textnode);
document.getElementById("menu").appendChild(node);
}
</script>
</body>
</html>
|
Output
when we click on button
Further Readings
You may also want to read these related articles :here
Ask Your Question
Got a programming related question? You may want to post your question here
Programming Answers here