JS DOM: appendChild
node.appendChild(newNode)
- Append newNode as child to node
- remove newNode from its original parent (if it has one), if both are in the same document.
- Return the appended newNode.
// get first paragraph const xx = document.getElementsByTagName("p")[0]; // move it to bottom of body document.body.appendChild(xx);
Copy and Append Node
To stop it from moving, you can make a clone first.
// get first paragraph const xx = document.getElementsByTagName("p")[0]; // clone and add it to bottom of body document.body. appendChild(xx.cloneNode(true));
Basic DOM Element Methods
- JS DOM: Node, Node Type, Element
- JS DOM: Get Element by ID, Name, Class etc
- JS DOM: Get Current Script Element
- JS DOM: Get Element Parent, Child, Sibling
- JS DOM: NodeList vs HTMLCollection
- JS DOM: Iterate HTMLCollection
- JS DOM: Element Attribute Methods
- JS DOM: Class Attribute (get add remove toggle)
- JS DOM: Create Element, Clone
- JS DOM: Insert, Remove, Replace Element
- JS DOM: insert Adjacent Element
- JS DOM: appendChild
- JS DOM: textContent, innerHTML, innerText, nodeValue
- JS DOM: Remove Element
- JS DOM: Remove All Children
- JS DOM: Change Element Content
- JS DOM: Add, Remove Event Handler