Co je to vlastně HTML DOM?
- zkratka DOM znamená (Document Object Model)
- je možné s ním manipulovat pomocí JavaScriptu
Přidávání elementu (append, appendChild)
HTML struktura
<body>
<div id="wrapper"></div>
</body>
- Inicializace wrapper (obalovacího) elementu
const wrapper = document.getElementById("wrapper");
2. Vytvoření elementu (div | element může být jakýkoli)
const div = document.createElement("div");
3. Přidání obsahu/elementu do divu
div.innerText = "Lorem ipsum dolor sit amet.";
div.innerHTML = "<p>Lorem ipsum dolor sit amet.</p>";
4. Přidání divu do parent elementu (append() — text, element | appendChild() — element)
wrapper.append(div);
Odebírání elementů (remove)
HTML struktura
<body>
<div id="element">Element</div>
</body>
Odebrání elementu pomocí metody remove() — tato metoda odebere element z DOMu
const element = document.getElementById("element");