HTML DOM (model objektu dokumentu) je hierarchická reprezentace HTML dokumentů. Definuje strukturu a vlastnosti prvků na webové stránce, umožňuje JavaScriptu dynamicky přistupovat, manipulovat s obsahem a aktualizovat jej, čímž se zvyšuje interaktivita a funkčnost.

Poznámka : Říká se tomu logická struktura, protože DOM neurčuje žádný vztah mezi objekty.

Obsah

• Proč je vyžadován DOM?
• Struktura DOM
• Vlastnosti DOM
• Metody objektového modelu dokumentu
• Co DOM není?
• Úrovně DOM:

Co je DOM?

DOM nebo Objektový model dokumentu , je programovací rozhraní, které představuje strukturované dokumenty jako HTML a XML jako strom předmětů. Definuje, jak přistupovat, manipulovat a upravovat prvky dokumentu pomocí skriptovacích jazyků, jako je JavaScript.

ls příkazy linux

Objektový model dokumentu je tedy v zásadě an API který reprezentuje a interaguje s HTML nebo XML dokumenty.

DOM je a W3C (World Wide Web Consortium) Standard a definuje standard pro přístup k dokumentům.

Standard W3C Dom je rozdělen do tří různých částí:

• Jádro DOM – standardní model pro všechny typy dokumentů
• XML DOM – standardní model pro XML dokumenty
• HTML DOM – standardní model pro HTML dokumenty

HTML DOM

HTML DOM je standard objektový model a programovací rozhraní pro HTML dokumenty. HTML DOM je způsob, jak reprezentovat webovou stránku v a strukturovaným hierarchickým způsobem takže pro programátory a uživatele bude snazší procházet dokumentem.

bash spánek

Pomocí HTML DOM můžeme snadno přistupovat ke značkám, ID, třídám, atributům nebo prvkům HTML a manipulovat s nimi pomocí příkazů nebo metod poskytovaných objektem dokumentu.

Pomocí DOM JavaScriptu získáme přístup k HTML i CSS webové stránky a můžeme také upravovat chování HTML prvků.

Proč je vyžadován DOM?

HTML se používá struktura webové stránky a Javascript se používá k přidání chování na naše webové stránky. Když je soubor HTML načten do prohlížeče, JavaScript nerozumí dokumentu HTML přímo. Interpretuje tedy a interaguje s objektovým modelem dokumentu (DOM), který je vytvořen prohlížečem na základě dokumentu HTML.

DOM je v podstatě reprezentace stejného dokumentu HTML, ale ve stromové struktuře složené z objektů. JavaScript nerozumí tagům () v HTML dokumentu, ale rozumí objektu h1 v DOM.

JavaScript snadno interpretuje DOM a používá jej jako most pro přístup k prvkům a manipulaci s nimi. DOM Javascript umožňuje přístup ke každému z objektů (h1, p atd.) pomocí různých funkcí.

Objektový model dokumentu (DOM) je nezbytný při vývoji webu z několika důvodů:

• Dynamické webové stránky: Umožňuje vytvářet dynamické webové stránky. Umožňuje JavaScriptu dynamicky přistupovat a manipulovat s obsahem, strukturou a stylem stránky, což poskytuje interaktivní a responzivní webové zážitky, jako je aktualizace obsahu bez opětovného načítání celé stránky nebo okamžitá reakce na akce uživatele.
• Interaktivita: Pomocí modelu DOM můžete reagovat na akce uživatele (jako jsou kliknutí, vstupy nebo posouvání) a odpovídajícím způsobem upravit webovou stránku.
• Aktualizace obsahu: Pokud chcete aktualizovat obsah bez obnovování celé stránky, DOM umožňuje cílené změny, díky nimž jsou webové aplikace efektivnější a uživatelsky přívětivější.
• Kompatibilita mezi prohlížeči: Různé prohlížeče mohou vykreslovat HTML a CSS různými způsoby. DOM poskytuje standardizovaný způsob interakce s prvky stránky.
• Jednostránkové aplikace (SPA): Aplikace vytvořené pomocí rámců, jako je React nebo Angular, silně spoléhají na DOM pro efektivní vykreslování a aktualizaci obsahu v rámci jediné stránky HTML bez opětovného načítání celé stránky.

Struktura DOM

DOM si lze představit jako strom nebo les (více než jeden strom). Termín model struktury se někdy používá k popisu stromové reprezentace dokumentu.

Každá větev stromu končí uzlem a každý uzel obsahuje objekty Posluchače událostí mohou být přidány do uzlů a spouštěny při výskytu dané události. Jednou z důležitých vlastností modelů struktury DOM je strukturální izomorfismus : pokud jsou k vytvoření reprezentace stejného dokumentu použity libovolné dvě implementace DOM, vytvoří stejný model struktury s přesně stejnými objekty a vztahy.

Proč se DOM nazývá objektový model?

Dokumenty se modelují pomocí objektů a model zahrnuje nejen strukturu dokumentu, ale také chování dokumentu a objektů, ze kterých se skládá, jako jsou prvky tagů s atributy v HTML.

kali linuxový terminál

Vlastnosti DOM

Podívejme se na vlastnosti objektu dokumentu, ke kterým lze přistupovat a upravovat je objektem dokumentu.

Zastoupení DOM

• Objekt okna : Window Object je objekt prohlížeče, který je vždy na vrcholu hierarchie. Je to jako API, které se používá k nastavení a přístupu ke všem vlastnostem a metodám prohlížeče. Je automaticky vytvořen prohlížečem.
• Objekt dokumentu: Když je dokument HTML načten do okna, stane se objektem dokumentu. Objekt „dokument“ má různé vlastnosti, které odkazují na jiné objekty, které umožňují přístup a úpravu obsahu webové stránky. Pokud je potřeba přistupovat k jakémukoli prvku na stránce HTML, vždy začínáme přístupem k objektu „dokument“. Objekt dokumentu je vlastnost objektu okna.
• Objekt formuláře: Je zastoupena formulář značky.
• Objekt odkazu : Je zastoupena odkaz značky.
• Ukotvení objektu : Je zastoupena a href značky.
• Ovládací prvky formuláře: Formulář může mít mnoho ovládacích prvků, jako jsou textová pole, tlačítka, přepínače, zaškrtávací políčka atd.

Metody objektu dokumentu

DOM poskytuje různé metody, které uživatelům umožňují pracovat s dokumentem a manipulovat s ním. Některé běžně používané metody DOM jsou:

Příklad: V tomto příkladu používáme ID prvku HTML k nalezení prvku HTML DOM.

    
techcodeview.comh2>
Portál informatiky pro geeky. p>
Tento příklad ilustruje getElementByIdb> metoda. p>
p>