DOM

The DOM stands for Document Object Model. It is the programming interface for web documents. Document Object Model (DOM) representation allows for manipulation of the html elements to create different kinds of interactions.

Selecting

getElementByIdselects any element in the html body that has a specified id

getElementByTagNameselects an element in the html body that has a certain tag

getElementsByNameselects a collection of elements in the html body that have a certain name

getElementsByClassNameselects a collection of elements in the html body that have a certain class

querySelectorselects a collection of elements in the html body that have a certain selector, like class

querySelectorAllto select a collection of elements in the html body that have a certain selector, like class

Adding

appendChild used to inject a new html element to the dom after creating it with the help of createElement

Removing

  To remove an html element one can use remove or removeChild method. The result in both cases is the same.

removeis used to remove an html element. It only needs a reference to the child.

removeChildis used to remove an html element. It needs both a reference to the child and the parent of the element to be removed.