Introduction of DOM (Document Object Model).

From the introduction of DOM to the selection of an element (getElementById or querrySelector) or several elements (querrySelectorAll, getElementsByClassName ,getElementsByTagName ), to modify a text element (innerText, innnerHTML, textContent )or their style( e.g: document.style.backgroundColor). That’s what i spent my day trying to understand. Here are some clarification .

First, DOM stands for Document Object Model. It is a JavaScript representation of the web page. It allows developers to access parts of the document (HTML page) and make changes as developers want.

To select a single element from the page, we use getElementById or querySelect and both do return a single element or object from the document . To select multiple elements, we use getElementsByClassName which returns an array like an object, getElementsByTagName returns a HTML collection of elements with the given Tag name and querrySelectorAll returns an array.

The other thing that i noticed is the difference between innerText, innerHTML and textContent. InnerText retrieves and sets the content of the tag as plain text, innerHTML does the same but put the content in HTML format. As for textContent , it is very similar to the innerText, but innerText is aware of the rendered appearance of text, while textContent is not.

As usual, i continue my typing and English lessons. Probably tomorrow i will finish one english course on udemy.