Dlaczego DOM jest konieczne?

DOM (Document Object Model) jest niezbędny, aby JavaScript mógł wchodzić w interakcję z zawartością strony internetowej i ją modyfikować. Reprezentuje strukturę dokumentu HTML w postaci drzewa obiektów, gdzie każdy węzeł odpowiada elementowi, atrybutowi lub fragmentowi tekstu na stronie.

Dzięki DOM, JavaScript może:

• Uzyskać dostęp do elementów strony (np. po id, klasie, tagu).
• Zmienić zawartość elementów (tekst, HTML).
• Zmienić style elementów.
• Zmienić strukturę dokumentu (dodawać, usuwać, przenosić elementy).
• Reagować na zdarzenia użytkownika (kliknięcia, najechanie myszą itp.).

Przykład pobrania elementu po ID:

// Pobieramy element o id "myElement"
const myElement = document.getElementById('myElement');

Przykład zmiany zawartości tekstowej elementu:

// Zmieniamy tekst zawartości elementu
myElement.textContent = 'Nowy tekst';

Bez DOM, interaktywność i dynamiczne zmiany na stronach internetowych byłyby niemożliwe.