Shrnutí

V této lekci jste se naučili, že:

• Stránka se píše v HTML a skládá se z prvků, které se zapisují pomocí tagů: <h1>Nadpis</h1>. Prvky mohou mít atributy, například id (jedinečné jméno) a class (název skupiny).
• Stránka načte skript pomocí <script src="script.js"></script> na konci body, aby prvky už existovaly, když se skript spustí. Skript se spustí při načtení stránky; jeho výpisy a chyby uvidíte v konzoli pod stránkou.
• document.querySelector() najde první prvek, který odpovídá selektoru: "h1", "#id" nebo ".trida". Když nic nenajde, vrátí null a jeho použití skončí chybou, třeba TypeError: Cannot read properties of null (reading 'textContent').
• textContent je text prvku; můžete ho číst i měnit.
• prvek.style.color = "red" změní jeden styl (názvy z CSS v camelCase, třeba backgroundColor); classList.add(), remove() a toggle() přidávají a odebírají třídy z CSS stránky.
• tlacitko.addEventListener("click", function () { ... }) spustí funkci při každém kliknutí. Předejte samotnou funkci, bez ().
• Data jsou v proměnných (počítadlo v proměnné s let, položky v poli); obsluha je změní a znovu je ukáže na stránce.
• vstup.value je text v textovém poli; Number() ho převede na číslo.
• document.createElement("li") vytvoří prvek a seznam.append(polozka) ho vloží do stránky. Pole zobrazíte tak, že seznam vyprázdníte pomocí seznam.textContent = "" a v cyklu vytvoříte položku pro každý prvek pole.

V příští lekci, Závěrečný projekt, dáte dohromady všechno, co jste se v kurzu naučili, a krok za krokem postavíte malou aplikaci.

Nejdřív si ale vše procvičte na kasičce, která sčítá vaše úspory. Tentokrát je script.js prázdný a celý program napíšete sami.