Cały materiał trwa 85 minut i obejmuje poniższe zagadnienia:
Czego się nauczysz z tego nagrania
- Czym jest DOM?
- Wyszukiwanie elementów
- .querySelector() vs .getElementById()
- .querySelectorAll() vs .getElementsBy*()
- Brak elementu/ów wyszukiwania
- Łączenie wyszukiwań
- Sposoby dołączania plików JS do HTML przy pomocy znacznika script
- Operacje na elementach
- Pobieranie nazwy znacznika tj. .tagName
- Czym są atrybuty?
- Pobieranie wartości atrybutu - getAttribute()
- Ustawianie wartości atrybutu - setAttribute()
- Sprawdzanie czy atrybut istnieje - hasAttribute()
- Wiele elementów i zarządzanie atrybutami
- Właściwość / Obiekt .dataset
- Identyfikatory (atrybut id)
- Klasy
- Właściwość .className
- Zarządzanie klasami przy pomocy .classList
- Zawartość elementów
- .innerText
- .textContent vs .innerText
- .innerHTML
- Właściwość style tj. definiowanie wyglądu elementów
- getComputedStyle() - pobieranie styli dla elementów
- .style.setProperty() - ustawianie wartości zmiennych z CSS
- Zarządzanie elementami
- Tworzenie elementów tj. document.createElement()
- Osadzanie elementów tj. appendChild(), insertBefore(), replaceChild()
- Kopia elementu (klonowanie) - .cloneNode()
- Usuwanie elementów tj. .removeChild() oraz remove()
- Poruszanie się po DOM
- Cofnięcie się do rodzica tj. .parentElement
- Poruszanie się poziome tj .nextElementSibling oraz .prevousElementSibling
- .nextElementSibling vs .nextSibling
- Pobranie wszystkich dzieci elementu tj. .children
- Sprawdzanie czy dzieci występuję tj. .hasChildNodes()
