Lecția 15: Manipularea DOM în JavaScript

1. Ce este DOM?

DOM (Document Object Model) este o reprezentare a structurii HTML a unei pagini web ca un arbore de obiecte. JavaScript poate manipula acest arbore pentru a modifica conținutul, stilul și structura paginii în timp real.

2. Selectarea unui element

// selectăm un element după ID
const titlu = document.getElementById('titlu');
titlu.textContent = 'Titlu modificat din JavaScript';
            

Titlu original

3. Modificarea conținutului și stilului

// schimbăm textul și culoarea unui paragraf
const paragraf = document.getElementById('paragraf');
paragraf.textContent = 'Textul a fost schimbat!';
paragraf.style.color = 'blue';
paragraf.style.fontWeight = 'bold';
            

Acesta este un paragraf original.

4. Adăugarea unui element nou

// creăm și adăugăm un nou paragraf
const container = document.getElementById('container');
const pNou = document.createElement('p');
pNou.textContent = 'Acesta este un paragraf nou creat cu JavaScript.';
container.appendChild(pNou);
            

Următoarea lecție: vom învăța despre funcțiile în JavaScript.