DOM - AppendChild

About

AppendChild is a node dom tree operation that:

• adds (a new node)
• move (a node of the DOM tree)

as children at the end of all already existing children of this node.

Syntax

returnedValue = node.appendChild(Node|documentFragment)

where:

• returnedValue is:
  • the appended child if the argument is a node
  • the empty DocumentFragment if the argument is a DocumentFragment

Example

With the HTML DOM

• A for loop to append several nodes.

for (var i=0;i<=3;i++){

• Create a node (ie a p element) in a document

  let p = document.createElement("p");
  p.innerText = "Lorem Ipsom "+i;

• Append it to the body

  document.body.appendChild(p);
}

• Result: