Dokument objektový model dom. Co je DOM a proč je potřeba? DOM není kopií původního HTML

Téma je opravdu složité. Ale jak se říká, ďábel není tak hrozný, jak je malován. Tady dostávám nejtěžší oříšek: tento super úkol „namalovat to“ co nejstravitelněji, ale ne úplně primitivně. Zatím všechny materiály, které jsem četl, bývají buď nesrozumitelné, nebo primitivní.

Co je DOM

Zkratka DOM znamená Objektový model dokumentu(objektový model dokumentu).

DOM je programovací rozhraní pro přístup k obsahu dokumentů HTML, XHTML a XML, tedy k reprezentaci značek a atributů HTML, XHTML a XML, jakož i CSS styly ve formě programovacích objektů. S tímto modelem funguje JavaScript i další webové programovací jazyky.

Trochu historie

K dispozici jsou 4 úrovně DOM (0, 1, 2 a 3).

Úroveň 0 (1996) zahrnovala modely DOM, které existovaly před úrovní 1. Jedná se především o kolekce: document.images, document.forms, document.layers a document.all. Tyto modely nejsou formálně DOM specifikacemi publikovanými W3C. Spíše představují informace o tom, co existovalo před zahájením procesu standardizace.

Úroveň 1 (1997) zahrnovala také základní funkčnost o zpracování XML dokumentů: četné způsoby práce s jednotlivými uzly, práce s instrukcemi XML zpracování atd.

DOM level 1 navíc obsahuje řadu speciálních rozhraní, která si poradí s jednotlivými HTML elementy. Můžete například pracovat s HTML tabulky, formuláře, výběrové seznamy atd.

DOM Level 2 (2002) přidal několik nových funkcí.

Zatímco DOM Level 1 postrádal podporu pro jmenné prostory, rozhraní DOM Level 2 obsahují metody pro správu jmenných prostorů spojených s požadavky na vytváření a zpracování dokumentů XML.

DOM úrovně 2 navíc podporuje události.

Úroveň 2 je aktuální úroveň specifikace DOM, ale W3C doporučuje některé části specifikace úrovně 3.

DOM Level 3 je pracovní návrh specifikace, která rozšiřuje funkčnost DOM Level 2. Jednou z nejdůležitějších funkcí této verze specifikace je schopnost pracovat s četnými rozšířeními DOM.

Co znamená „softwarové rozhraní“?

Anglické slovo interface lze přeložit jako „kontaktní oblast“. Počítač, zhruba řečeno, rozumí pouze dvěma věcem: prázdný bit a vyplněný bit. Jazyk, kterým počítač „mluví“, si lze představit jako nekonečný řetězec nul a jedniček, který dává nekonečné množství různých kombinací.

Jakýkoli programový kód je interpretací, srozumitelnou pro programátora, těchto „nul a jedniček“, se kterými počítač pracuje. Každý programovací jazyk je tedy rozhraní člověk-stroj.

Prohlížeče fungují stejně jako ostatní počítačové aplikace. Interpretují HTML, XML, CSS kódy, JavaScript, PHP, Perl atd. na „nuly a jedničky“. K řešení této mnohojazyčnosti je zapotřebí společná platforma. Tato platforma je DOM – specifikace, která nezávisí na konkrétním programovacím jazyce nebo značce. Jedná se o rozhraní, které lze použít v mnoha oblíbených programovacích jazycích spojených s tvorbou webových stránek a schopné porozumět a interpretovat objekty DOM.

DOM a prohlížeče

DOM a JavaScript

V JavaScriptu je vrcholem hierarchického žebříčku objektů DOM, jakýmsi „vodičem“ tohoto rozhraní, objekt dokumentu a objekty DOM se stávají jeho vlastnostmi, vlastnostmi jeho vlastností atd. Nazývají se také uzly DOM.

DOM uzly

V DOM úrovně 2 je 12 typů uzlů. Každému typu uzlu DOM je přiřazena konstanta s jedinečné jméno. Většina uzlů je navržena pro práci s XML. V sestavě HTML - JavaScript, kterou děláme, lze použít pouze 5 typů. Ale i tato „špička ledovce“ je velmi „roztahující se strom“, který nelze obsáhnout v jedné nebo dvou lekcích.

Úplná sada konstant typu uzlů definovaných ve specifikaci W3C DOM (uzly dostupné pro HTML - JavaScript jsou zvýrazněny modře):

Konstantní jméno	Význam	Popis
Uzel.ELEMENT_NODE		Element Node (vrací kořenový element dokumentu, u HTML dokumentů je to element HTML)
Uzel.ATTRIBUTE_NODE		Uzel atributu (vrací atribut prvku dokumentu XML nebo HTML)
		Textový uzel (#text)
Uzel.CDATA_SECTION_NODE		Uzel sekce CDATA (XML: alternativní syntaxe pro zobrazení znakových dat)
Uzel.ENTITY_REFERENCE_NODE
Uzel.ENTITY_NODE		Uzel oddílu
Uzel.PROCESSING_INSTRUCTION_NODE		Uzel direktivy XML
Uzel.COMMENT_NODE		Uzel komentáře
Uzel.DOCUMENT_NODE		Uzel dokumentu (základ pro přístup k obsahu dokumentu a vytváření jeho součástí)
Uzel.DOCUMENT_TYPE_NODE		Uzel typu dokumentu (vrací typ tohoto dokumentu, tj. hodnotu tagu DOCTYPE)
Uzel.DOCUMENT_FRAGMENT_NODE		Uzel fragmentu dokumentu (extrahujte část stromu dokumentu, vytvořte nový fragment dokumentu, vložte fragment jako podřízený prvek jakýkoli uzel atd.)
Uzel.NOTATION_NODE		Notační uzel*

* Notace jsou názvy, které identifikují formát neanalyzovaných sekcí, formát prvků, které mají atribut notace, nebo aplikační program, kterému je direktiva určena. (Není to jasné? Ani já si ještě nejsem příliš jistý.)

Struktura dokumentu v DOM

Všechny objekty dokumentu jsou uzly DOM. Podívejme se na základní dokument:

< title>Hlavička DOM

Text odstavce

Zde je schéma jeho stromu DOM:

Každý uzel může mít podřízené uzly (v diagramu k nim vedou šipky). Objekt dokumentu - základ stromu dokumentu - je také uzel, ale nemá nadřazený uzel a má řadu vlastností a metod, které jiné uzly nemají. Má jeden podřízený uzel: prvek.

Prvek má dva podřízené uzly: a , pro které se všechny prvky v nich obsažené stanou potomky.

Pozornost!

"Prvek" a "tag" nejsou synonyma. Značka je značka: - jedná se o dvě různé značky. A prvek je objekt označený těmito značkami:

Text odstavce

.

Prvky a

Uvnitř obsahuje text. Toto jsou jejich podřízené textové uzly. Prvek má také atribut: align="center" . Uzly atributů jsou také podřízené uzly prvků, které je obsahují.

Při práci s uzly stromu DOM se využívají jejich vlastnosti a metody.

Některé vlastnosti uzlů

Malý úvod

Ještě jednou opakuji: když přistupujeme k prvkům stránky ve skriptech, máme co do činění nejen s jazykem Javascript, ale také s rozhraním DOM v něm zabudovaným. Někdy si to musíte uvědomit, někdy můžete zapomenout, „že mluvíme v próze“.

Některé vlastnosti a metody z objektového modelu DOM jsme tímto způsobem již použili. Proto čas od času uvedu odkazy na předchozí lekce.

V této lekci nepůjdeme „akademickou“ cestou, vezmeme-li v úvahu všechny vlastnosti všech uzlů ve všech prohlížečích. Nejprve se seznámíme s nejpraktičtějšími a „bezkonfliktními“ z nich.

Proto nezačneme, jak je zvykem, „hlavními vlastnostmi“: nodeName a nodeValue.

název štítku

Vrátí řetězec obsahující název značky prvku. Všechny hodnoty tagName obsahují pouze velká písmena.

Syntax

živel.název štítku

Příklad

Testování vlastnosti tagName

document.write(document.getElementById( "testTagName").název štítku)

Výsledek

Testování vlastnosti tagName

vnitřní HTML

S touto vlastností jsme se již setkali (viz lekce 10). A teď chápeme, odkud to přišlo: „z domova“.

Umožňuje přístup k obsahu prvku. Určuje nejen textový obsah, ale také všechny HTML tagy umístěné uvnitř prvku.

Tato vlastnost neslouží pouze ke čtení, ale také ke změně obsahu.

Poznámka

V IE je innerHTML pro řadu prvků pouze pro čtení: to jsou všechny prvky tabulky, s výjimkou a , stejně jako a .

Vytvořili jsme například prázdnou tabulku bez prvku a chceme jej programově vložit do přes innerHTML:

IE zobrazí " Neznámá chyba spuštění" a ostatní prohlížeče provedou vložení.

Zároveň, pokud se dotazujeme na existující obsah prvku , například přes alert(document.getElementById("id").innerHTML) , pak to bude fungovat v IE.

Syntax

živel.innerHTML = "přidělený text"

Příklad

Testování vlastnosti innerHTML Odstavec k vložení // Tato funkce přečte text a vloží jej do daného odstavce. funkce testRead() ( document.getElementById( "cílová".innerHTML = document.getElementById( "testInnerHTML").vnitřníHTML } // Tato funkce změní text daného odstavce. funkce testChange() ( document.getElementById( "cílová").vnitřníHTML = "Přebarvování a změna textu" } // Tato funkce vrátí vlastnost do původní polohy. funkce testReset() ( document.getElementById( "cílová").vnitřníHTML = "Odstavec k vložení" }

Testování vlastnosti innerHTML

Odstavec k vložení

DOM se často nazývá strom DOM, protože se skládá ze stromu objektů nazývaných uzly. V tomto článku jste se dozvěděli, co je objektový model dokumentu (DOM), jak přistupovat k objektu dokumentu a měnit jeho vlastnosti pomocí konzoly a jaký je rozdíl mezi zdrojovým kódem HTML a DOM.

V tomto tutoriálu se naučíte terminologii HTML, kterou potřebujete pro práci s JavaScriptem a DOM, naučíte se, co je to strom a uzly DOM, a naučíte se identifikovat nejběžnější typy uzlů. Můžete také vytvořit program JavaScript v konzole a interaktivně upravit DOM.

HTML terminologie

Porozumění pojmům HTML a JavaScript je pro práci s DOM zásadní. Pojďme se v rychlosti podívat na základní pojmy.

Podívejte se na tento HTML prvek:

Domov

Obsahuje kotvu, což je odkaz na index.html.

• a – tag
• href – atribut
• html – hodnota atributu
• Domů – text.

Vše mezi úvodní a závěrečnou značkou tvoří HTML element.

Vraťme se k souboru index.html z předchozí příručky:

Učení DOM


Objektový model dokumentu

Nejjednodušším způsobem přístupu k prvku pomocí JavaScriptu je atribut id. Výše uvedený odkaz přidáme do souboru index.html s id="nav".

...

Objektový model dokumentu
Domov

...

Načtěte (nebo obnovte) stránku v okně prohlížeče a podívejte se na DOM, abyste zjistili, zda byl kód aktualizován.

Poté použijte metodu getElementById() pro přístup k celému prvku. V konzole zadejte následující:

document.getElementById("nav");
Domov

Metoda getElementById() načte celý prvek. Nyní místo toho, abyste museli zadávat tento objekt a metodu pokaždé, když potřebujete získat přístup k navigačnímu odkazu, můžete prvek vložit do proměnné, aby se s ním snadněji pracovalo.

let navLink = document.getElementById("nav");

Proměnná navLink obsahuje kotvu. Zde můžete snadno změnit atributy a hodnoty. Chcete-li například změnit umístění odkazu, změňte atribut href:

navLink.href = "https://www.wikipedia.org";

Text můžete také změnit změnou přiřazení vlastnosti textContent:

navLink.textContent = "Přejít na Wikipedii";

Nyní, když tento prvek zobrazíte v konzole nebo zaškrtnete značku Elements, uvidíte, jak se aktualizoval.

navLink;
Přejděte na Wikipedii

Změny se projeví i na frontendu.

Obnovení stránky vrátí všechny původní hodnoty.

V tomto bodě byste měli pochopit, jak používat metodu dokumentu pro přístup k prvku, jak přiřadit prvek k proměnné a jak změnit vlastnosti a hodnoty prvku.

Strom a uzly DOM

Všechny prvky v DOM jsou definovány jako uzly. Existuje mnoho typů uzlů, ale jsou tři hlavní, se kterými budete pracovat nejčastěji:

Uzel prvku

Textový uzel

Uzel komentáře

Když je prvek HTML prvkem v DOM, nazývá se uzel prvku. Každý jednotlivý text mimo prvek je textový uzel a komentář HTML je uzel komentáře. Kromě těchto tří typů uzlů je samotný objekt dokumentu uzlem dokumentu, který je kořenovým uzlem všech ostatních uzlů.

DOM se skládá ze stromové struktury vnořených uzlů, často nazývaných strom DOM. Asi víte, co je to rodokmen – jde o schematické znázornění rodinných vazeb, které tvoří rodiče, děti a nejbližší příbuzní. Uzly v DOM se také nazývají nadřazené a podřízené na základě jejich vztahu k jiným uzlům.

Vytvořte například soubor nodes.html. přidejte do něj textový uzel a také komentáře a uzly prvků.

Učení o uzlech


Uzel prvku

Textový uzel.

Uzel prvku html je rodič. hlava a tělo jsou podřízené html uzly. tělo obsahuje tři podřízené uzly a všechny jsou na stejné úrovni – typ uzlu neovlivňuje úroveň vnoření.

Poznámka: Při práci s DOM generovaným HTML, odsazení zdrojový kód HTML vytváří mnoho prázdných textových uzlů, které nebudou viditelné na kartě DevTools Elements. Více o tom na odkazu.

Definování typu uzlu

Každý uzel v dokumentu má typ, ke kterému se přistupuje prostřednictvím vlastnosti nodeType. Mozilla Developer Network má aktualizovaný seznam všech konstant typu uzlů. Níže je tabulka nejběžnějších typů uzlů.

Na kartě Prvky v Nástrojích pro vývojáře si můžete všimnout, že kdykoli kliknete a zvýrazníte jakýkoli řádek v DOM, zobrazí se vedle něj hodnota == $0. Toto je velmi pohodlný způsob přístup k aktuálně aktivnímu prvku.

V konzole node.html klikněte na první prvek v těle (h1).

Pomocí konzoly zjistěte typ vybraného uzlu pomocí vlastnosti nodeType.

$0.nodeType;
1

Výběrem prvku h1 uvidíte 1 jako výstup, který odkazuje na ELEMENT_NODE. Udělejte totéž s ostatními uzly a vrátí 3 a 8.

Když víte, jak přistupovat k prvku, můžete vidět typ uzlu bez zvýraznění prvků v DOM.

document.body.nodeType;
1

Kromě nodeType můžete také použít vlastnost nodeValue k získání hodnoty textu nebo uzlu komentáře a nodeName k získání tagu prvku.

Změna DOM pomocí událostí

Doposud jste viděli, jak změnit DOM v konzole, a je známo, že takové změny jsou dočasné; při každém obnovení stránky jsou všechny změny ztraceny. V jste aktualizovali barvu pozadí stránky v konzole. Zkuste zkombinovat to, co jste se naučili v tomto tutoriálu, s tím, co již znáte, a vytvořit interaktivní tlačítko, které změní barvu pozadí.

Vraťte se do souboru index.html a přidejte prvek tlačítka s id. Musíte také přidat odkaz na nový soubor v novém adresáři js js/scripts.js.

Učení DOM


Objektový model dokumentu
Změnit barvu pozadí

Událost v JavaScriptu je akce, kterou uživatel provede. Uživatel najede myší na prvek, klikne na něj nebo na určitou klávesu na klávesnici – to vše jsou události. V tomto konkrétním případě by tlačítko mělo provést akci, když na něj uživatel klikne. Chcete-li to provést, musíte přidat posluchač události. Vytvořte soubor scripts.js a uložte jej do nového adresáře js. V souboru je třeba definovat prvek tlačítka a přiřadit jej k proměnné.

Pomocí metody addEventListener() bude tlačítko naslouchat kliknutí a po kliknutí bude plnit svou funkci.

...
button.addEventListener("click", () => (
// akce bude probíhat zde
});

Uvnitř funkce je potřeba umístit kód z předchozího návodu pro změnu barvy pozadí na fuchsiovou.

...

Takto vypadá skript:

let button = document.getElementById("changeBackground");
button.addEventListener("click", () => (
document.body.style.backgroundColor = "fuchsiová";
});

Uložte a zavřete soubor. Obnovte stránku index.html ve svém prohlížeči. Klikněte na nové tlačítko a barva pozadí stránky se změní.

Štítky: ,

vnitřní HTML
var text = element.innerHTML;
element.innerHTML = "";
Přiřazení nového innerHTML přepíše kód, i když je nová hodnota připojena k aktuální (+=). Skripty přidané tímto způsobem se nespouštějí.

vnější HTML
Obsahuje celý prvek a nelze jej změnit. Technicky vzato, zápis do této vlastnosti vytváří nový prvek, který nahrazuje ten starý. Odkazy na starý prvek v proměnných se nemění.

data
textNode.data - obsah textových uzlů a komentářů

textObsah
element.textContent - text uvnitř prvku bez značek.
Existuje také nestandardní vlastnost nazvaná innerText, která má mnoho společného s textContent.

Viditelnost prvku

skrytý
prvek.skrytý = pravda
Atribut skrytý není v IE11 podporován.

Atributy

Většina standardních atributů v DOM se stává vlastnostmi objektu:
element.id = "id"
U nestandardních atributů není vlastnost vytvořena (nedefinováno)

Můžete si vytvořit své vlastní vlastnosti DOM:
element.myData = (jméno:"Jan", příjmení:"Smith");
a metody:
element.myFunc = function())(upozornění this.nodeName);
Funguje to, protože uzly DOM jsou běžné objekty JavaScriptu. Takové nestandardní vlastnosti a metody nemají vliv na zobrazení tagu a jsou viditelné pouze v JavaScriptu.

Přístup k atributům značek:
element.hasAttribute(název)
element.getAttribute(název)
element.setAttribute(název, hodnota)
element.removeAttribute(název)
element.attributes je pseudosoubor atributů.

Atributy nerozlišují malá a velká písmena (html), zatímco vlastnosti rozlišují malá a velká písmena (javaScript).
Hodnota atributu je vždy řetězec.

Atribut: a.getAttribute("href") - zobrazuje přesně to, co je v HTML
Vlastnost: a.href – může se lišit od hodnoty atributu
Nejčastěji vlastnost závisí na atributu, ale ne naopak. Změna vlastnosti nemá vliv na atribut.

Práce s třídami

Atribut class odpovídá dvěma vlastnostem:
className - řetězec
classList — objekt

metody objektu classList:
element.classList.contains("class") - kontroluje, zda objekt obsahuje danou třídu
element.classList.add("třída")
element.classList.remove("třída")
element.classList.toggle("třída")

classList je pseudo-pole, lze jej iterovat pro smyčku.

datové atributy

Vlastní atributy dat jsou dostupné nejen jako atributy, ale také prostřednictvím vlastnosti datové sady
data-about = "nějaká hodnota"
element.dataset.about

Pořadí uzlů

parent.contains(child) — pravda nebo nepravda
zkontroluje, zda je podřízený uzel vnořen do nadřazeného uzlu

nodeA.compareDocumentPosition(nodeB) - Poskytuje informace o obsahu a relativním pořadí prvků. Návratová hodnota je bitová maska:

Přidávání a odebírání uzlů

var div = document.createElement("div")
document.createTextNode("text")

parent.appendChild(element) - prvek je přidán na konec rodiče
parent.insertBefore(element, nextSibling) - prvek je přidán před nextSibling
parent.insertBefore(element, parent.firstChild) - přidáno na začátek
parent.insertBefore(element, null) - bude fungovat jako appendChild
Všechny metody vložení vrátí vložený uzel.
Při přesouvání prvku jej nemusíte nejprve odstraňovat ze starého místa, způsob vkládání to provede automaticky.

element.insertAdjacentHTML(where, html) - vloží libovolný HTML kód kamkoli do dokumentu. Where určuje, kam má být html ve vztahu k prvku vloženo - beforeBegin, afterBegin, beforeEnd, afterEnd.
element.insertAdjacentElement(where, newElement)
element.insertAdjacentText(kde, text)
Poslední dvě metody nejsou ve Firefoxu podporovány

node.append(...nodes) – vloží uzly na konec node ,
node.prepend(...nodes) – vloží uzly na začátek node ,
node.after(...nodes) – vloží uzly za uzel node,
node.before(...nodes) – vloží uzly před uzel node,
node.replaceWith(...nodes) – vloží uzly místo node .
zde uzly jsou uzly nebo řetězce, v libovolném množství a kombinacích, uvedené oddělené čárkami.

var fragment = document.createDocumentFragment() - simuluje uzel DOM, který po vložení do dokumentu zmizí a zůstanou pouze jeho potomci. V moderní prohlížeče Nedoporučeno.

element.cloneNode(true) - hluboká kopie prvku
element.cloneNode(false) - kopie bez podřízených prvků

parent.removeChild(element)
parent.replaceChild(newElement, element)
element.remove() - odstraní prvek přímo, bez odkazu na jeho rodiče.
Metody vracejí vzdálený uzel

Když otevřete jakýkoli dokument HTML, prohlížeč nejprve analyzuje jeho obsah a na základě této analýzy vytvoří objektový model dokumentu HTML, zkráceně DOM.

DOM se skládá z hierarchicky vnořených objektů nazývaných uzly. Každý uzel ve struktuře představuje umístění na HTML stránkuživel.

Pomocí DOM můžete komunikovat ( číst, měnit, mazat) s obsahem HTML dokumentů ze skriptů.

Níže je uveden kód pro HTML dokument a DOM, které by byly vytvořeny prohlížečem na základě tohoto kódu:

HTML DOM HTML DOM.

Ahoj všichni.

Všechny obdélníky zobrazené na obrázku jsou objekty (nebo uzly). Uzly různých typů jsou na obrázku označeny různými barvami.

Uzel Dokument je označen červeně. Jakýkoli přístup k DOM musí začínat přístupem k tomuto uzlu.

Elementární uzly jsou označeny zeleně. Pro každého HTML prvek Na stránce prohlížeč vytvoří odpovídající uzel prvku.

Obsah prvků je uložen v textových uzlech. Textové uzly jsou v našem diagramu označeny modře.

Pro každého HTML atribut element je vytvořen atributový uzel. Uzel atributu je na diagramu označen růžově.

Poznámka: Pamatujte, že text je vždy uložen v textových uzlech a není vlastností prvku. Tito. Chcete-li získat přístup k obsahu prvku HTML, musíte získat přístup k jeho vlastnosti textového uzlu.

Vztahy mezi uzly

Uzly ve struktuře objektu jsou vzájemně propojeny. Existuje několik speciálních termínů pro popis vztahů mezi uzly:

Nadřazený uzel ( nadřazený uzel) - nadřazený uzel ve vztahu k danému objektu je uzel, do kterého je daný objekt vnořen. V našem diagramu ve vztahu k uzlům a

je rodič. Pro uzel je nadřazený uzel .

Sestupné uzly ( podřízený uzel) - podřízený uzel ve vztahu k dotyčnému objektu je uzel, který je vnořen do dotyčného objektu. V našem diagramu ve vztahu k uzlu a

Jsou to potomci. Pro uzel je dítě .

Sourozenecké uzly ( sourozenecký uzel) - uzly, které jsou na stejné úrovni vnoření vzhledem k jejich nadřazenému uzlu. V našem diagramu jsou sourozenecké uzly a ,

Nejvyšší uzel v DOM se nazývá kořen. V našem diagramu je to kořen (protože objekt dokumentu není součástí DOM).

Tato publikace předchází řadě článků o alternativní způsoby práci s XML. „Alternativní“, protože práce s XML v 1C je zpravidla omezena na analýzu xml pomocí sekvenčního čtení - řádkovou analýzu obsahu textu. Ale jsou i jiné způsoby.

Například pomocí XML dotazovacího jazyka xPath nebo šablon transformace XSL. Tyto možnosti budou diskutovány v dalších článcích. Všechny ale spoléhají na základní DOM reprezentaci XML dokumentů. Co je to DOM (dokumentový objektový model), bude probráno v publikaci.

DOM je založen na reprezentaci dokumentu libovolné struktury ve formě stromu uzlů, z nichž každý uzel (uzel) představuje prvek, atribut prvku, textovou hodnotu prvku atd. Spojení mezi uzly je postaven na principu „rodič - podřízení“. Kořen dokumentu (strom DOM) nemá žádného rodiče. Slepý prvek nemá potomka (takové prvky se abstraktně nazývají listy stromu). DOM tak lze vytvořit nejen pro XML, ale prakticky pro jakýkoli strukturovaný dokument (HTML, XHTML). Takže například prohlížeč uživatele, který obdrží HTML kód webové stránky z internetu, vytvoří strom DOM této stránky v paměti RAM počítače uživatele.

DOM otevírá široké možnosti pro manipulaci s daty dokumentů. Můžete vytvářet nové uzly, vkládat je na různé úrovně stromu, kopírovat uzly, mazat uzly, hledat uzly podle různé parametry a mnohem víc.

model DOM XML dokument je jasně znázorněno na obrázku níže.

Žádný moderní jazyk programování zahrnuje nástroje (parsery) pro práci s takovým stromem. Analyzátor XML přijímá obsah řetězce jako vstup a vytváří strom uzlů v paměti RAM a provádí manipulace s daty stromu. Výhoda tohoto přístupu oproti analýze řádků po řádcích je zřejmá: jedním dotazem do stromu můžete vybrat potřebná data, aniž byste museli procházet celý dokument řádek po řádku, protože RAM obsahuje kompletní reprezentaci prvků se všemi vztahy.

V platformě 1C je zastoupen model DOM speciální objekt DocumentDOM, který je zase vytvořen pomocí objektu DOMBuilder a jeho metody Read. Vstupem do této metody je obvykle buď XML Reader nebo HTML Reader objekt, který přímo čte XML nebo HTML textový obsah ze souborů nebo jej načítá z řetězce. No, pak existuje řada konstrukcí, které umožňují extrahovat data z objektového modelu čteného dokumentu.

Ze všech možností je z mého pohledu nejzajímavější možnost č. 1 pomocí metody CalculateXPathExpression. Jemu bude věnován další článek.

Výhody analýzy řádek po řádku: potřeba zdrojů je menší. Nevýhody: získání dat trvá dlouho, je třeba číst celý soubor řádek po řádku, složitost programový kód při analýze XML dokumentů se složitou strukturou.

Výhoda vzorkování přes DOM: rychlost vzorkování dat, jednoduchost programového kódu. Nevýhody: náročná na zdroje, vynaložené na stavbu a dotazy na DOM RAM a výpočetní výkon.