Strom je jednou z najčastejšie používaných dátových štruktúr pri vývoji webu. Každý webový vývojár, ktorý píše HTML a načíta ho do prehliadača, vytvorí strom s názvom Document Object Model (DOM).

Napríklad článok, ktorý práve čítate, sa v prehliadači zobrazí ako strom. Odseky sú reprezentované ako prvky

; prvkov

Vnorené do prvku ; a vnorené v prvku .

Vkladanie údajov je ako rodokmeň. Prvok je rodič je jeho dieťaťom a prvkom<р>je dieťaťom živlu .

V tomto článku používame dve rôzne metódy prechodu cez strom: vyhľadávanie do hĺbky ( DFS) a vyhľadávanie na šírku ( bfs). Oba tieto typy prechodu zahŕňajú rôzne spôsoby interakcie so stromom a zahŕňajú použitie dátových štruktúr, ktorým sme sa venovali v tejto sérii článkov. DFS používa zásobník, zatiaľ čo BFS používa front.

Strom (DFS a vyhľadávanie podľa šírky)

V informatike je strom štruktúra, ktorá definuje hierarchické údaje s uzlami. Každý uzol stromu obsahuje svoje vlastné údaje a ukazovatele na iné uzly.

Porovnajme strom so štruktúrou organizácie. Táto štruktúra má titul najvyššej úrovne (koreňový uzol), ako napríklad generálny riaditeľ. Pod touto pozíciou sú ďalšie pozície, ako napríklad viceprezident ( VP).

Na znázornenie ich velenia používame šípky ukazujúce od generálneho riaditeľa k viceprezidentovi. Pozície ako generálny riaditeľ sú uzly; odkazy, ktoré sme označili od generálneho riaditeľa k viceprezidentovi, sú ukazovatele. Aby sme vytvorili ďalšie prepojenia v našej organizačnej štruktúre, tento proces zopakujeme pridaním ukazovateľov na iné uzly.

Poďme sa pozrieť na DOM. DOM obsahuje prvok , čo je prvok najvyššej úrovne (koreňový uzol). Tento uzol ukazuje na prvky a . Tento proces sa opakuje pre všetky uzly v DOM.

Jednou z výhod tohto dizajnu je schopnosť vnoriť uzly: prvok

, môže napríklad obsahovať veľa prvkov
• , vnorené v ňom; Navyše každý prvok
• môže mať uzly
• rovnakú úroveň.

  Operácie stromov

  Každý strom obsahuje uzly, ktoré môžu byť samostatnými stromovými konštruktormi a my zadefinujeme operácie pre uzol aj stromový konštruktor.

  uzol

  • údaje - tu sú uložené hodnoty;
  • rodič - ukazuje na nadradený prvok uzla;
  • deti - ukazuje na ďalší uzol v zozname.

  strom

  • _root - ukazuje na koreňový uzol stromu;
  • traverseDF (spätné volanie)- prechádza cez uzly stromu pomocou metódy DFS;
  • traverseBF(callback) - prechádza cez uzly stromu pomocou metódy BFS;
  • obsahuje(údaje, prechod) - hľadá uzol stromu;
  • add(data, toData, traverse) - pridá uzol do stromu;
  • remove(child, parent) - Odstráni uzol stromu.

  Implementácia stromu

  Teraz napíšme kód stromu.

  Vlastnosti uzla

  Na implementáciu najskôr zadefinujeme funkciu s názvom Node a potom konštruktor s názvom Tree :

  function Node(data) ( this.data = data; this.parent = null; this.children = ; )

  Každá inštancia uzla obsahuje tri vlastnosti: údaje , rodič a deti . Prvá vlastnosť sa používa na ukladanie údajov spojených s uzlom. Druhá vlastnosť ukazuje na jeden uzol. Tretia vlastnosť ukazuje na dcérske uzly.

  vlastnosti stromu

  Poďme definovať náš konštruktor pre strom , ktorý vo svojom tele obsahuje konštruktor Node:

  function Tree(data) (var node = new Node(data); this._root = node; )

  Strom obsahuje dva riadky kódu. Prvý riadok vytvorí novú inštanciu uzla; druhý riadok priradí uzol ako koreňový prvok stromu.

  Definícia stromu a uzla trvá len niekoľko riadkov kódu. To nám však stačí na definovanie hierarchických údajov. Aby sme to dokázali, použite niekoľko príkladov na vytvorenie inštancie stromu:

  var strom = nový strom("CEO"); // (údaje: "CEO", rodič: null, deti: ) tree._root;

  Pomocou rodičov a potomkov môžeme pridať uzly ako deti _root a tiež priradiť _root ako rodičov týchto uzlov. Inými slovami, môžeme definovať hierarchiu údajov.

  Stromové metódy

  Vytvoríme nasledujúcich päť metód:

  • traverseDF(spätné volanie) ;
  • traverseBF(spätné volanie) ;
  • obsahuje(údaje, prechod) ;
  • pridať(dieťa, rodič);
  • remove(uzol, rodič) .

  Pretože každá metóda vyžaduje prechod cez strom, najprv implementujeme metódy, ktoré definujú rôzne typy prechodu cez strom.

  traverseDF(callback) metóda

  Metóda prechodu cez strom pomocou hĺbkového vyhľadávania:

  Tree.prototype.traverseDF = function(callback) ( // toto je rekurzívna a okamžite volateľná funkcia (funkcia recurse(currentNode) ( // krok 2 for (var i = 0, length = currentNode.children.length; i< length; i++) { // шаг 3 recurse(currentNode.children[i]); } // шаг 4 callback(currentNode); // шаг 1 })(this._root); };

  traverseDF(callback) obsahuje parameter s názvom spätného volania. (callback) je funkcia, ktorá bude volaná neskôr v traverseDF(callback) .

  Telo traverseDF (callback) obsahuje ďalšiu funkciu nazývanú recurse . Ide o rekurzívnu funkciu, ktorá odkazuje sama na seba a automaticky sa ukončí. Pomocou krokov načrtnutých v komentároch k funkcii rekurzia opíšem celý proces, ktorý rekurzia používa na prechádzanie celého stromu.

  Tu sú kroky:

  • Ako argument nazývame rekurzu s koreňovým uzlom stromu. Aktuálne currentNode ukazuje na aktuálny uzol;
  • Zadáme cyklus for a iterujeme ho raz pre každý podriadený uzol pre currentNode , počnúc prvým;
  • V tele cyklu for voláme rekurzívnu funkciu s podriadeným uzlom pre uzol currentNode . Ktorý uzol to je, závisí od aktuálnej iterácie cyklu for;
  • Keď currentNode nemá žiadne ďalšie potomky, ukončíme cyklus for a zavoláme ( zavolaj späť), ktoré sme prešli počas volania na traverseDF(callback) .

  Kroky 2 ( samoukončujúce), 3 (samovolanie) a 4 (spätné volanie) sa opakujú, kým sa neprejde každý uzol stromu.

  Rekurzia je veľmi zložitá téma. Aby ste to pochopili, môžete experimentovať s našou súčasnou implementáciou traverseDF( zavolaj späť ) a pokúste sa pochopiť, ako to funguje.

  Nasledujúci príklad demonštruje prechod cez strom pomocou traverseDF(callback) . Pre tento príklad najskôr vytvorím strom. Prístup, ktorý budem používať, nie je ideálny, ale funguje. Bolo by lepšie použiť metódu add(value), ktorú implementujeme v kroku 4:

  var strom = new Tree("jeden"); tree._root.children.push(new Node("dva")); tree._root.children.parent = strom; tree._root.children.push(new Node("tri")); tree._root.children.parent = strom; tree._root.children.push(new Node("štyri")); tree._root.children.parent = strom; tree._root.children.children.push(new Node("päť")); tree._root.children.children.parent = strom._koreň.deti; tree._root.children.children.push(new Node("šesť")); tree._root.children.children.parent = strom._koreň.deti; tree._root.children.children.push(new Node("sedem")); tree._root.children.children.parent = strom._koreň.deti; /* vytvorte nasledujúci strom jeden ├── dva │ ├── päť │ └── šesť ├── tri └── štyri └── sedem */

  Teraz zavolajme traverseDF (spätné volanie):

  tree.traverseDF(funkcia(uzol) ( console.log(uzol.data) )); /* vytlačí nasledujúce riadky do konzoly "päť" "šesť" "dva" "tri" "sedem" "štyri" "jeden" */

  traverseBF(callback) metóda

  Metóda prechádzania stromu podľa šírky. Rozdiel medzi prehľadávaním do hĺbky a prehľadávaním do šírky spočíva v poradí, v ktorom sa prechádzajú uzly stromu. Aby sme to ilustrovali, použime strom, ktorý sme vytvorili na implementáciu metódy traverseDF(callback):

  /* strom jeden (hĺbka: 0) ├── dva (hĺbka: 1) │ ├── päť (hĺbka: 2) │ └── šesť (hĺbka: 2) ├── tri (hĺbka: 1) štyri (hĺbka: 1) └── sedem (hĺbka: 2) */

  Teraz prejdime na traverseBF (spätné volanie) rovnaké spätné volanie, ktoré sme použili pre traverseDF (spätné volanie):

  tree.traverseBF(funkcia(uzol) ( console.log(uzol.data) )); /* vytlačí nasledujúce riadky do konzoly "jeden" "dva" "tri" "štyri" "päť" "šesť" "sedem" */

  Reťazce vytlačíme na konzolu a náš stromový diagram nám ukáže obrázok, ktorý odráža princíp vyhľadávania na šírku. Začnite v koreňovom uzle; potom prejdite o jednu úroveň a navštívte každý uzol tejto úrovne zľava doprava. Tento postup opakujte, kým nebudú dokončené všetky úrovne. Poďme implementovať kód, s ktorým bude tento príklad fungovať:

  Tree.prototype.traverseBF = function(callback) ( var queue = new Queue(); queue.enqueue(this._root); currentTree = queue.dequeue(); while(currentTree)( for (var i = 0, length = currentStree.deti.length;i< length; i++) { queue.enqueue(currentTree.children[i]); } callback(currentTree); currentTree = queue.dequeue(); } };

  Definíciu traverseBF(callback) vysvetlím krok za krokom:

  • Vytvorte inštanciu Queue ;
  • Pridajte uzol, ktorý sa nazýva traverseBF(callback) na inštanciu Queue;
  • Deklarujeme premennú currentNode a inicializujeme ju pre uzol, ktorý sme práve pridali do frontu;
  • Kým currentNode ukazuje na uzol, spustite kód v rámci cyklu while;
  • Použite cyklus for na zacyklenie cez podradené uzly currentNode ;
  • V tele cyklu for pridajte každý podriadený uzol do frontu;
  • Vezmeme currentNode a odovzdáme ho ako argument pre spätné volanie;
  • Nastavte currentNode na uzol, ktorý sa má odstrániť z frontu;
  • Pokiaľ currentNode ukazuje na uzol, musí sa prejsť každý uzol v strome. Ak to chcete urobiť, zopakujte kroky 4 až 8.

  obsahuje (callback, traversal) metódu

  Definujme metódu, ktorá nám umožní nájsť konkrétnu hodnotu v strome. Ak chcete použiť ktorúkoľvek z metód prechodu cez strom, nastavil som include(spätné volanie, prechod), aby som prijal dva argumenty: údaje, ktoré hľadáme, a typ prechodu:

  Tree.prototype.contains = function(callback, traversal) ( traversal.call(this, callback); );

  V tele obsahuje(callback, traversal) používame metódu nazývanú call na odovzdanie tohto a callback . Prvý argument viaže traversal na strom, v ktorom sa volá include(callback, traversal); druhý argument je funkcia, ktorá sa volá na každom uzle stromu.

  Predstavte si, že chceme vytlačiť do konzoly všetky uzly, ktoré obsahujú nepárne údaje, a prejsť každým uzlom stromu pomocou metódy BFS. Ak to chcete urobiť, napíšte nasledujúci kód:

  // strom je príklad stromu koreňového uzla. obsahuje(funkcia(uzol)( if (uzol. údaje === "dva") ( console. log(node); ) ), strom. traverseBF);

  metóda add(data, toData, traversal)

  Teraz máme metódu na nájdenie uzla v strome. Definujme metódu, ktorá nám umožní pridať uzol do konkrétneho uzla:

  Tree.prototype.add = function(data, toData, traversal) ( var child = new Node(data), parent = null, callback = function(node) ( if (node.data === toData) ( parent = node; ) ); this.contains(callback, traversal); if (rodič) ( parent.children.push(child); child.parent = parent; ) else ( throw new Error("Nie je možné pridať uzol k neexistujúcemu rodičovi. ");));

  add(data, toData, traversal) definuje tri parametre. údaje sa používajú na vytvorenie novej inštancie uzla. toData sa používa na porovnanie každého uzla v strome. Tretí parameter, prechod, je typ prechodu stromom použitý v tejto metóde.

  V tele add(data, toData, traversal) deklarujeme tri premenné. Prvá premenná, dieťa, sa inicializuje ako nová inštancia uzla. Druhá premenná, rodič , je inicializovaná na hodnotu null ; ale neskôr ukáže na akýkoľvek uzol v strome, ktorý zodpovedá hodnote toData . Opätovné priradenie rodiča sa vykonáva v tretej premennej, spätné volanie .

  callback je funkcia, ktorá porovnáva toData s dátovou vlastnosťou každého uzla. Ak uzol spĺňa podmienku príkazu if, je priradený ako nadradený .

  Skutočné porovnanie každého uzla s toData sa vykonáva vo vnútri add(data, toData, traversal) . Typ prechodu a spätné volanie musia byť odovzdané ako argumenty na pridanie (data, toData, traversal) .

  Ak rodič v strome neexistuje, dáme dieťa do parent.children ; rodiča priradíme aj potomkovi, inak sa vyvolá chyba.

  Použime add(data, toData, traversal) v našom príklade:

  var strom = nový strom("CEO"); tree.add("VP of Happiness", "CEO", tree.traverseBF); /* náš strom "CEO" └── "VP of Happiness" */

  Tu je zložitejší príklad s použitím add(data, toData, traversal):

  var strom = nový strom("CEO"); tree.add("VP of Happiness", "CEO", tree.traverseBF); tree.add("VP pre financie", "CEO", strom.traverseBF); tree.add("VP of Sadness", "CEO", tree.traverseBF); tree.add("Riaditeľ šteniatok", "Viceprezident financií", tree.traverseBF); tree.add("Manažér šteniatok", "Riaditeľ šteniatok", tree.traverseBF); /* strom "CEO" ├── "Viceprezident šťastia" ├── "Viceprezident financií" │ ├── "Riaditeľ pre šteniatka" │ └── "Manažér šteniatok" └──" * "

  remove(data, fromData, traversal) metóda

  Aby sme plne implementovali strom, musíme pridať metódu s názvom remove(data, fromData, traversal). Podobne ako pri odstraňovaní uzla z DOM, táto metóda odstráni uzol a všetky jeho podriadené uzly:

  Tree.prototype.remove = function(data, fromData, traversal) ( var tree = this, parent = null, childToRemove = null, index; var callback = function(node) ( if (node.data === fromData) ( parent = uzol; ) ); this.contains(spätné volanie, prechádzanie); if (rodič) ( index = nájsťIndex(rodič.deti, údaje); if (index === nedefinované) ( vyvolať novú chybu("Uzol na odstránenie nie je exist."); ) else ( childToRemove = parent.children.splice(index, 1); ) ) else ( throw new Error("Rodič neexistuje."); ) return childToRemove; );

  Rovnako ako add(data, toData, traversal) metóda remove prechádza celým stromom, aby našla uzol, ktorý obsahuje druhý argument, ktorý sa momentálne rovná fromData . Ak sa tento uzol nájde, rodič naň ukáže v prvom príkaze if.

  Spracoval: Evgeniy Ryzhkov Dátum publikácie: 15. 11. 2010

  Strom dokumentov(strom dokumentov) je schéma na zostavenie dokumentu HTML, ktorý ukazuje vzťahy medzi rôznymi prvkami stránky: poradie a vnorenie prvkov. Tento diagram vám pomáha orientovať sa v tomto zdanlivo chaotickom zmätku značiek HTML.

  Ako webový vývojár pomáha strom dokumentov s písaním pravidiel CSS a skriptov Javascript.

  Poznámka

  Nezamieňajte si strom dokumentu s objektovým modelom dokumentu (DOM). DOM je komplexnejší koncept (o ňom bude písané trochu neskôr).

  Aby sme nezachádzali do dlhých a únavných vysvetlení, prečo sa strom dokumentov nazýva strom, pozrime sa na príklad – zoberme si jednoduchý HTML kód:

  hlavná hlavička

  odsek textu.

  • odsek 1
  • bod 2

  Druhý titul

  Takto vidia HTML kód neosvietení domorodci, ktorí omylom klikli na zobrazenie kódu stránky. Ale trénované oko webového vývojára to rozoberie, uvidí všetky úrovne hniezdenia a prepojenia. Vybuduje jasnú hierarchickú štruktúru z chaosu vo forme stromu (pretože schéma je podobná obrysom stromu):

  Rodinné väzby

  Medzi prvkami stromu dokumentu existujú určité vzťahy. Zvážme ich.

  Predkovia a potomkovia

  Zo schematického znázornenia stromu a zo samotného HTML kódu je zrejmé, že niektoré prvky sú vnorené do iných. Prvky, ktoré obsahujú iné, sú predkovia(predok) vo vzťahu ku všetkému, čo sa do toho investuje. Vnorené sú zase jeho potomkov(potomok).

  Pre prehľadnosť zvážte jednu vetvu nášho stromu:

  Každý predok môže mať neobmedzený počet potomkov. Každé dieťa bude mať niekoľko predkov v závislosti od štruktúry stromu a v ktorej vetve sa bude nachádzať, ale v každom prípade bude existovať aspoň jeden predok.

  Rodičia a dcéry

  Rodič(rodič) je bezprostredný predok (predok prvej úrovne) prvku. Naopak, bezprostredné dieťa (dieťa prvej úrovne) sa nazýva detský prvok(dieťa).

  Každý rodič môže mať neobmedzený počet detí. Podradený prvok bude mať iba jedného rodiča.

  Rodičovský prvok je tiež tzv priamy predok a podradeným prvkom je priamy potomok. Je to niečo ako sémantické mená.

  sesterské prvky

  Súrodenci sú skupinou dvoch alebo viacerých prvkov, ktoré majú spoločného rodiča. Prvky nemusia byť rovnakého typu, stačí, že majú spoločného rodiča.

  Susedné prvky

  Susedné prvky(susedné) sú sesterské prvky, ktoré sa nachádzajú „vedľa“.

  Predchádzajúca sestra a ďalšia sestra

  Všetko by malo byť jasné z názvov samotných výrazov. Predchádzajúca sestra (predchádzajúci súrodenec) – prvok predchádzajúcej sestry v kóde. V našej vzorovej pobočke pre

  Toto bude

  Pre

  —

  , a pre

  nebude žiadne predchádzajúce sesterstvo.

  Podobne aj nasledujúca sestra (za súrodencom): za

  —

  Pre

  —

  , pre
  - Nie.

  Predchádzajúce a nasledujúce

  Predchádzajúci prvok (predchádzajúci) je rovnaký predchádzajúci prvok podľa kódu, len bez obmedzení sesterského vzťahu. Pre našu pobočku: pre

  Toto bude

  Pre

  —

  , pre

  —

  .

  Strom dokumentov(strom dokumentov) je schéma na zostavenie dokumentu HTML, ktorý ukazuje vzťahy medzi rôznymi prvkami stránky: poradie a vnorenie prvkov. Tento diagram vám pomáha orientovať sa v tomto zdanlivo chaotickom zmätku značiek HTML.

  Ako webový vývojár pomáha strom dokumentov s písaním pravidiel CSS a skriptov Javascript.

  Poznámka

  Nezamieňajte si strom dokumentu s objektovým modelom dokumentu (DOM). DOM je komplexnejší koncept (o ňom bude písané trochu neskôr).

  Aby sme nezachádzali do dlhých a únavných vysvetlení, prečo sa strom dokumentov nazýva strom, pozrime sa na príklad – zoberme si jednoduchý HTML kód:

  hlavná hlavička

  odsek textu.

  • odsek 1
  • bod 2

  Druhý titul

  Takto vidia HTML kód neosvietení domorodci, ktorí omylom klikli na zobrazenie kódu stránky. Ale trénované oko webového vývojára to rozoberie, uvidí všetky úrovne hniezdenia a prepojenia. Vybuduje jasnú hierarchickú štruktúru z chaosu vo forme stromu (pretože schéma je podobná obrysom stromu):

  Rodinné väzby

  Medzi prvkami stromu dokumentu existujú určité vzťahy. Zvážme ich.

  Predkovia a potomkovia

  Zo schematického znázornenia stromu a zo samotného HTML kódu je zrejmé, že niektoré prvky sú vnorené do iných. Prvky, ktoré obsahujú iné, sú predkovia(predok) vo vzťahu ku všetkému, čo sa do toho investuje. Vnorené sú zase jeho potomkov(potomok).

  Pre prehľadnosť zvážte jednu vetvu nášho stromu:

  

  Každý predok môže mať neobmedzený počet potomkov. Každé dieťa bude mať niekoľko predkov v závislosti od štruktúry stromu a v ktorej vetve sa bude nachádzať, ale v každom prípade bude existovať aspoň jeden predok.

  Rodičia a dcéry

  Rodič(rodič) je bezprostredný predok (predok prvej úrovne) prvku. Naopak, bezprostredné dieťa (dieťa prvej úrovne) sa nazýva detský prvok(dieťa).

  

  Každý rodič môže mať neobmedzený počet detí. Podradený prvok bude mať iba jedného rodiča.

  Rodičovský prvok je tiež tzv priamy predok a podradeným prvkom je priamy potomok. Je to niečo ako sémantické mená.

  sesterské prvky

  Súrodenci sú skupinou dvoch alebo viacerých prvkov, ktoré majú spoločného rodiča. Prvky nemusia byť rovnakého typu, stačí, že majú spoločného rodiča.

  

  Susedné prvky

  Susedné prvky(susedné) sú sesterské prvky, ktoré sa nachádzajú „vedľa“.

  

  Predchádzajúca sestra a ďalšia sestra

  Všetko by malo byť jasné z názvov samotných výrazov. Predchádzajúca sestra (predchádzajúci súrodenec) – prvok predchádzajúcej sestry v kóde. V našej vzorovej pobočke pre

  Toto bude

  Pre

  —

  , a pre

  nebude žiadne predchádzajúce sesterstvo.

  Podobne aj nasledujúca sestra (za súrodencom): za

  —

  Pre

  —

  , pre
  - Nie.

  Predchádzajúce a nasledujúce

  Predchádzajúci prvok (predchádzajúci) je rovnaký predchádzajúci prvok podľa kódu, len bez obmedzení sesterského vzťahu. Pre našu pobočku: pre

  Toto bude

  Pre

  —

  , pre

  —

  .

  Podobne ďalší prvok (predchádzajúci) nemá žiadne obmedzenia vzťahu sesterského: for

  —

  Pre

  Prvé dieťa a posledné

  Prvý potomok (prvý potomok) je prvým potomkom rodiča v strome dokumentov a posledný (posledný potomok) je posledný.

  

  Koreňový prvok

  Koreňový prvok (koreň) je predkom všetkých predkov, je to „koreň“ nášho stromu dokumentov, je to jediný prvok, ktorý nemá rodiča, to je .

  A XHTML, ktorý bol definovaný v definíciách natívnej syntaxe, HTML5 je popísaný definíciami Document Object Model (DOM) – na zobrazenie dokumentu použite internú stromovú reprezentáciu. Predstavte si napríklad veľmi malý dokument pozostávajúci z nadpisu strany, nadpisu a tela odseku. Strom DOM môže vyzerať takto:

  Strom DOM obsahuje prvok title v hlavovom bloku a h1 a p v tele.

  Výhodou opisu HTML5 v definíciách objektového modelu dokumentu je, že jazyk možno definovať nezávisle od syntaxe. Pre reprezentáciu dokumentu existujú prevažne dve jazykové syntaxe: HTML serializácia (HTML5) a XML serializácia (XHTML5).

  HTML odkazuje na syntax odvodenú od SGML (prvé HTML), ale je definovaný tak, aby bol v praxi viac kompatibilný so skutočnou podporou prehliadača pre HTML.

  príklad

  Rovnako ako v minulých verziách HTML sú niektoré značky voliteľné a automaticky sa použijú.

  Serializácia XML vychádza zo syntaxe XML 1.0 a konvencií pomenovania, rovnako ako XHTML 1.0.

  príklad

  Toto je príklad HTML dokumentu.

  Okrem rozdielov v prítomnosti a neprítomnosti atribútu xmlns sú tieto dva príklady ekvivalentné.

  Prehliadače používajú na výber typ MIME. Každý dokument deklarovaný ako text/html musí spĺňať požiadavky špecifikácie HTML a každý dokument deklarovaný ako typ XML MIME (ako napríklad application/xhtml+xml) musí zodpovedať špecifikácii XML.

  Tvorcovia robia informované rozhodnutia o tom, čo použijú, čo môže byť založené na množstve rôznych dôvodov. Vývojári by si nemali bezpodmienečne vyberať jedno alebo druhé; každý je optimalizovaný pre iné situácie.

  Výhody používania HTML

  • Spätná porovnateľnosť s existujúcimi prehliadačmi.
  • známa syntax.
  • Nenáročná syntax (v prípade chyby nebude existovať žiadna „žltá obrazovka smrti“).
  • Syntax umožňujúca vynechanie určitých značiek a atribútov.

  Výhody používania XHTML

  • Seriózna syntax XML, ktorú niektorí tvorcovia pohodlne podporujú.
  • Pripája sa priamo k iným slovníkom XML (napríklad SVG a MathML).
  • Implementácia spracovania XML.

  Spolupráca

  Práca na HTML5 rýchlo napreduje, no očakáva sa, že bude dokončená až o pár rokov. Aby bolo možné vykonať rôzne testy a dosiahnuť interoperabilitu implementácií, ktoré spĺňajú požiadavky podľa súčasných odhadov, bude to trvať 10 až 15 rokov práce. Počas celého vývojového kroku je pre úspech nevyhnutná spätná väzba od širokého spektra používateľov, vrátane webových dizajnérov, vývojárov, predajcov CMS a vývojových nástrojov a predajcov prehliadačov. Príspevky k vývoju HTML5 sú nielen vítané, ale aj dôrazne podporované.

  Okrem špecifikácie existuje množstvo ďalších zdrojov, ktoré majú ľuďom pomôcť lepšie pochopiť proces.

  • Rozdiely oproti HTML 4 načrtávajú konfigurácie v porovnaní s predchádzajúcou verziou HTML
  • Princípy návrhu HTML pojednávajú o princípoch, ktoré vám pomôžu pri rozhodovaní. Pomôžu vám pochopiť základy dostupných konštrukčných riešení.
  • WEB Developer`s Guide to HTML5, nedávno uvedený zdroj, ktorý má pomôcť webovým dizajnérom a vývojárom pochopiť všetko, čo potrebujú vedieť, aby mohli písať dokumenty vyhovujúce HTML5. Poskytujú sa hlavné princípy a sú opísané najlepšie riešenia.

  Existuje mnoho spôsobov, ako sami prispieť k rozvoju. Môžete sa pripojiť k HTML WG W3C a prihlásiť sa/prispievať do HTML WG mailing listov alebo wiki. Budete sa tiež môcť zapojiť do fóra WHATWG, písať komentáre alebo písať články na blog WHATWG.

  — junior). Všetky prvky stromu sú potomkov root a ten je ich predok. Zároveň sú všetky prvky a texty, ktoré tvoria ich obsah uzly strom dokumentov.

  Každý prvok v tomto strome zodpovedá prvku HTML, a preto má značku (značky), obsah a sadu atribútov. Ak chcete prejsť na objektový model dokumentu, zostáva jediným krokom, aby ste pomenovali všetky prvky stromu ako objekty a aby ich atribúty boli čitateľné a upraviteľné zo skriptov a apletov. Výsledkom je, že strom elementov dokumentu HTML sa stáva dynamicky riadeným; navyše teraz môžeme každému prvku okrem štandardných HTML atribútov jednoducho pridávať nové vlastnosti.

  Práve tento prístup bol základom pre dynamický HTML model prehliadačov Microsoft a následne prijatý ako základ pre štandardy W3C, tzv. objektový model dokumentu(Document Object Model alebo DOM). W3C zároveň rozšírilo koncept DOM na akékoľvek XML dokumenty, pričom HTML DOM považovalo za špecializovaný špeciálny prípad s ďalšími funkciami. DOM je teda model dokumentov HTML a XML, nezávislý od platformy a programovacieho jazyka, ktorý definuje:

  • rozhrania a objekty, ktoré sa používajú na reprezentáciu dokumentu a manipuláciu s ním;
  • sémantiku týchto rozhraní a objektov vrátane ich atribútov a reakcií na udalosti;
  • vzťahy medzi týmito rozhraniami a objektmi.

  K dnešnému dňu má W3C štandardizované úrovne DOM jedna a dva (DOM 1 a DOM 2); DOM 3 je v štádiu pracovného návrhu. Tieto skratky znamenajú nasledovné:

  • DOM 1 popisuje základnú reprezentáciu XML a HTML dokumentov ako stromov objektov;
  • DOM 2 rozširuje základné rozhrania DOM 1 a pridáva podporu pre udalosti a štýly;
  • DOM 3 popisuje načítanie a analýzu dokumentov, ako aj ich zobrazenie a formátovanie.

  Vzhľadom na súčasný stav vecí sa tu pozeráme len na DOM 2 (a DOM 1, ktorý obsahuje). DOM 2 pozostáva z nasledujúcich skupín vzájomne prepojených rozhraní:

  • Core - základné rozhrania, ktoré definujú reprezentáciu akéhokoľvek XML dokumentu vo forme stromu;
  • View - rozhrania, ktoré popisujú možné zobrazenie dokumentu;
  • Udalosť – rozhrania, ktoré určujú poradie, v ktorom sa udalosti generujú a spracúvajú;
  • Štýl - rozhrania, ktoré určujú použitie štýlov na dokumenty;
  • Traversal & Range - rozhrania, ktoré definujú prechádzanie stromom dokumentu a manipuláciu s oblasťami jeho obsahu;
  • HTML – rozhrania, ktoré definujú reprezentáciu HTML dokumentu vo forme stromu.

  Začnime definovaním základných rozhraní, ktoré sú základom všetkých ďalších špecifikácií.

  4.2.2. Základné pojmy

  DOM 2 Core predstavuje XML dokumenty ako stromy, čo sú uzly, ktoré sú zase objektmi a implementujú špecializovanejšie rozhrania. Niektoré typy uzlov môžu mať deti, t.j. samy sú podstromy, iné sú listy, t.j. nemajú deti. Nasledujúca tabuľka sumarizuje všetky možné typy uzlov abstraktných dokumentov; pre každý typ uzla sú uvedené uzly, ktoré môžu byť jeho potomkami. Pojmy zodpovedajúce uvedeným uzlom nájdete v popise štruktúry dokumentu XML.

  Tabuľka 4.1. Stromová štruktúra dokumentu

  Rozhranie	Popis	deti
  	dokument	Element (nie viac ako jeden), ProcessingInstruction , Comment , DocumentType (nie viac ako jeden)
  	Fragment dokumentu	Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
  Typ dokumentu	typ dokumentu	nemá deti
  EntityReference	Odkaz na sekciu	Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
  prvok	Prvok	Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
  Attr	Atribút	Text, EntityReference
  Návod na spracovanie	XML smernica	nemá deti
  Komentujte	Komentujte	nemá deti
  Text	Text	nemá deti
  Sekcia CDATA	sekcia CDATA	nemá deti
  subjekt	kapitola	Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
  notový zápis	Notový zápis	nemá deti

  Okrem toho DOM 2 Core obsahuje špecifikáciu rozhraní NodeList (usporiadané zoznamy uzlov prístupné podľa čísla zoznamu) a NamedNodeMap (neusporiadané zoznamy uzlov prístupné podľa ich názvu). Tieto objekty sú nažive t.j. každá zmena v dokumente automaticky znamená zmenu vo všetkých zoznamoch, ktoré sú s ním spojené.

  Je potrebné zdôrazniť, že DOM 2 Core obsahuje dve sady rozhraní, z ktorých každá poskytuje plný prístup ku všetkým prvkom dokumentu. Prvá množina predstavuje objektovo orientovaný prístup s nasledujúcou hierarchiou dedenia: dokument - jeho základné prvky - ich atribúty a obsah textu. Pri tejto úvahe o strome dokumentov hovoríme o hierarchie objektov. Druhý prístup je založený na princípe „všetko sú uzly (Nodes)“. Tu sa všetky komponenty dokumentu považujú za rovnocenné uzly jeho stromu a môžeme sa o tom len baviť hierarchie uzlov. DOM 2 je teda vo svojej podstate nadbytočný, ale dáva nám možnosť, v závislosti od úlohy, zvážiť dokument tak či onak.

  Všetky rozhrania DOM 2 Core sú rozdelené na základné (základné) a doplnkové (rozšírené). Hlavné rozhrania sú , , , , Node , NodeList , NamedNodeMap , CharacterData , Attr , Element , Text a Comment . Tieto rozhrania musia byť podporované všetkými implementáciami DOM pre dokumenty XML aj HTML. Ďalšie rozhrania sa zameriavajú na dokumenty XML, takže implementácie HTML DOM ich nemusia podporovať. Patria sem CDATASection, DocumentType, Notation, Entity, EntityReference a ProcessingInstruction.

  Pre nezávislosť jazyka a platformy definuje DOM nasledujúce typy:

  DOMString Textový reťazec pozostávajúci zo znakov Unicode vo formáte UTF-16. V JavaScripte a Jave je implementovaný typom String. DOMTimeStamp Dátum a čas vo formáte špecifickom pre daný jazyk. Napríklad v JavaScripte by to bol objekt Dátum a v jazyku Java celé číslo typu long obsahujúce počet milisekúnd.

  Nižšie je uvedený stručný popis všetkých rozhraní DOM s uvedením úrovne modelu (DOM 1 alebo DOM 2), v ktorej je definovaná konkrétna vlastnosť rozhrania. Špecifikácie W3C sú napísané v IDL nezávislom od platformy. Prinášame ich v súlade so syntaxou JavaScriptu, ktorý je dnes hlavným skriptovacím jazykom.

  Spolu s popisom štandardu uvádzame stručný popis jeho implementácie v objektových modeloch Microsoft a Gecko. Majte na pamäti, že implementácie Microsoftu pre XML a HTML sú úplne nezávislé (implementujú ich softvérové ​​komponenty XMLDOM a MSHTML), zatiaľ čo objektový model Gecka je rovnaký pre dokumenty HTML a XML. Nasledujúca diskusia sa zameriava na DOM pre HTML; XML DOM bude podrobne rozobratý v časti VIII.

  4.2.3. Výnimky: rozhranie DOMException

  Objekt DOMException je prototypom pre všetky výnimky, ktoré sa môžu vyskytnúť počas spracovania dokumentu. Má jednu vlastnosť kódu typu číslo, ktorá obsahuje číslo výnimky podľa nasledujúcej tabuľky:

  Tabuľka 4.2. Štandardné výnimky DOM

  názov	Význam	Popis	Model
  INDEX_SIZE_ERR	1	Index je mimo rozsahu.	DOM 1
  DOMSTRING_SIZE_ERR	2	Zadaný text nemožno pretypovať na typ .	DOM 1
  HIERARCHY_REQUEST_ERR	3	Uskutočnil sa pokus vložiť uzol na nesprávne miesto v strome.	DOM 1
  WRONG_DOCUMENT_ERR	4	Neplatný typ dokumentu.	DOM 1
  INVALID_CHARACTER_ERR	5	Bol nájdený neplatný znak.	DOM 1
  NO_DATA_ALLOWED_ERR	6	Uzol neobsahuje žiadne údaje.	DOM 1
  NO_MODIFICATION_ALLOWED_ERR	7	Došlo k pokusu o neplatnú úpravu objektu.	DOM 1
  NOT_FOUND_ERR	8	Odkazovanie na neexistujúci uzol.	DOM 1
  NOT_SUPPORTED_ERR	9	Parameter alebo operácia nie je implementovaná.	DOM 1
  INUSE_ATTRIBUTE_ERR	10	Uskutočnil sa pokus o pridanie atribútu, ktorý už existuje.	DOM 1
  INVALID_STATE_ERR	11	Odkazovanie na neexistujúci objekt.	DOM 1
  SYNTAX_ERR	12	Chyba syntaxe.	DOM 2
  INVALID_MODIFICATION_ERR	13	Uskutočnil sa pokus o zmenu typu objektu.	DOM 2
  NAMESPACE_ERR	14	Uskutočnil sa pokus o vytvorenie alebo úpravu objektu, ktorý sa nezhoduje s priestorom názvov XML.	DOM 2
  INVALID_ACCESS_ERR	15	Parameter alebo operácia nie je podporovaná objektom.	DOM 2

  podpora: Neštandardná implementácia. Niektoré chybové kódy sú podporované.

  4.2.4. Popis implementácie: Rozhranie DOMImplementation

  podpora: Len pre dokumenty XML (XMLDOMImplementation). Vyhovuje DOM 1.

  Rozhranie DOMImplementation obsahuje metódy, ktoré sú nezávislé od konkrétneho objektového modelu dokumentu. Je dostupný prostredníctvom vlastnosti objektu.

  metóda createCSSStyleSheet

  Syntax : objekt.createCSSStyleSheet(názov, médium) Argumenty: názov, médium - výrazy ako Výsledok: nový objekt CSSStyleSheet Výnimky: SYNTAX_ERR podpora

  Metóda vytvorte CSSStyleSheet vytvorí nový objekt CSSStyleSheet a vráti naň ukazovateľ. Túto metódu by mali podporovať iba implementácie DOM, ktoré podporujú CSS. Objekt je vytvorený mimo kontextu dokumentu; DOM 2 vám neumožňuje zahrnúť novovytvorenú šablónu štýlov do dokumentu. Argument title určuje názov šablóny štýlov a médium je zoznam zobrazovacích zariadení oddelených čiarkami.

  metóda createDocument

  Syntax : objekt.createDocument(namespaceURI, kvalifikovanýName, doctype) Argumenty: namespaceURI, kvalifikovanýName - výrazy typu doctype - výraz typu DocumentType Výsledok: nový objekt Výnimky: INVALID_CHARACTER_ERR, NAMESPACE_ERR, WRONG_DOCUMENT_ERR podpora: Nie je podporované. Nie je podporované.

  Metóda vytvoriť dokument vytvorí nový objekt a vráti naň ukazovateľ. Je určený na vytváranie dokumentov XML a nemusí byť podporovaný pre dokumenty HTML. Argument namespaceURI špecifikuje URI menného priestoru koreňového prvku dokumentu, kvalifikovanýName je jeho kvalifikovaný názov a doctype je typ dokumentu, ktorý sa má vytvoriť (môže byť nulový).

  metóda createDocumentType

  Syntax : objekt.createDocumentType(qualifiedName, publicId, systemId) Argumenty: kvalifikovanýName, publicId, systemId - výrazy ako Výsledok: nový uzol DocumentType Výnimky podpora: Nie je podporované. Nie je podporované.

  Metóda createDocumentType vytvorí prázdny uzol typu DocumentType a vráti naň ukazovateľ. Je určený pre dokumenty XML a nemusí byť podporovaný pre dokumenty HTML. Argument kvalifikovaný názov určuje kvalifikovaný názov typu dokumentu, ktorý sa má vytvoriť, publicId je verejný identifikátor externej sekcie a systemId je systémový identifikátor externej sekcie.

  hasFeature metóda

  Syntax : objekt.hasFeature(vlastnosť, verzia) Argumenty: vlastnosť, verzia - typ výrazov Výsledok: boolovská hodnota Výnimky: Nie podpora

  Metóda máVlastnosť sa vracia pravda ak implementácia DOM podporuje špecifikovanú vlastnosť a falošné inak. Názov vlastnosti (v každom prípade) je daný argumentom funkcie; musí zodpovedať konvenciám pomenovávania XML. Argument verzia určuje názov verzie vlastnosti, ktorá sa kontroluje. Ak nie je nastavený, vráti sa pravda ak je podporovaná aspoň nejaká verzia tejto vlastnosti.

  V Gecko môžu byť hodnotami vlastností reťazce „XML“ a „HTML“ a hodnotou verzie môžu byť reťazce „1.0“ a „2.0“. Príklad:

  Alert(document.implementation.hasFeature("HTML", "1.0")); alert(document.implementation.hasFeature("HTML", "2.0")); alert(document.implementation.hasFeature("HTML", "3.0"));

  Prvé dva varovné príkazy vytlačia reťazec true a tretí false.

  V Microsoft XMLDOM môžu byť hodnotami vlastností reťazce „XML“, „DOM“ a „MS-DOM“ a verzia môže byť reťazec „1.0“. Príklad:

  Var objDoc = new ActiveXObject("Microsoft.XMLDOM"); alert(objDoc.implementation.hasFeature("XML", "1.0")); alert(objDoc.implementation.hasFeature("XML", "2.0"));

  Prvý výstražný príkaz vypíše reťazec true a druhý false.

  4.2.5. Document Fragment: Rozhranie DocumentFragment

  podpora: Len pre dokumenty XML (XMLDOMDocumentFragment). Vyhovuje DOM 1.

  Rozhranie DocumentFragment je potomkom rozhrania Node a dedí všetky jeho vlastnosti a metódy. Ako už z názvu vyplýva, je určený pre operácie s fragmenty dokumentov(získanie časti stromu dokumentu, vytvorenie nového fragmentu dokumentu, vloženie fragmentu ako potomka uzla atď.). Všimnite si, že keď vložíte objekt typu DocumentFragment do uzla, ktorý môže mať potomkov, vložia sa všetky potomkovia tohto objektu, ale nie samotný objekt. Príklady nájdete v popise rozhrania uzla.

  4.2.6. Dokument: Rozhranie dokumentu

  podpora: Podporované pre dokumenty XML (XMLDOMDocument); pre HTML dokumenty je čiastočne podporovaný. DOM 1 úplne, DOM 2 čiastočne.

  Rozhranie dokumentu zodpovedá dokumentu XML alebo HTML. Je základom pre prístup k obsahu dokumentu a na vytváranie jeho komponentov.

  Metódy rozhrania dokumentu

  Nehnuteľnosť	Model	Popis
  	DOM 1	Vytvorí atribút.
  	DOM 2	Vytvorí atribút s menným priestorom.
  	DOM 1	Vytvorí sekciu CDATA.
  	DOM 1	Vytvorí komentár.
  	DOM 1	Vytvorí nový fragment dokumentu.
  	DOM 1	Vytvorí nový prvok.
  	DOM 2	Vytvorí prvok s daným menným priestorom.
  	DOM 1	Vytvorí odkaz na sekciu.
  	DOM 2	Vytvorí nový objekt udalosti.
  	DOM 1	Vytvorí smernicu.
  	DOM 1	Vytvorí nový textový uzol.
  	DOM 2	Vráti prvok s daným ID.
  	DOM 1	Vráti kolekciu všetkých prvkov, ktoré majú danú značku.
  	DOM 2	Vráti kolekciu všetkých prvkov, ktoré majú danú značku s daným priestorom názvov.
  	DOM 2	Importuje uzol z iného dokumentu.

  vlastnosť doctype

  Syntax : dokument.doctype premenlivý: Nie podpora

  Nehnuteľnosť doctype vráti typ daného dokumentu (typu DocumentType). Pre HTML dokumenty a XML dokumenty, ktoré nemajú deklaráciu typu dokumentu, vráti nulový.

  vlastnosť documentElement

  Syntax : dokument.documentElement premenlivý: Nie podpora: Vyhovuje norme. Vyhovuje norme.

  Nehnuteľnosť documentElement vráti koreňový prvok daného dokumentu (typu Element). V prípade dokumentov HTML sa prvok vráti HTML. Príklad: operátor

  Alert(document.documentElement.tagName);

  zobrazí reťazec HTML.

  realizačný majetok

  Syntax : dokument.realizácia premenlivý: Nie podpora: Len pre dokumenty XML. Vyhovuje DOM 1.

  Nehnuteľnosť implementáciu vráti objekt typu popisujúceho danú implementáciu DOM.

  vlastnosť styleSheets

  Syntax : dokument.styleSheets premenlivý: Nie podpora: Len pre HTML dokumenty. Vyhovuje norme.

  Nehnuteľnosť štýly vráti objekt typu StyleSheetList zodpovedajúci zoznamu externých a interných štýlov dokumentu. Túto vlastnosť podporujú iba implementácie DOM, ktoré podporujú dynamické šablóny štýlov.

  metóda createAttribute

  Syntax : dokument.createAttribute(name) Argumenty: meno - typový výraz Výsledok: nový objekt Attr Výnimky: INVALID_CHARACTER_ERR podpora: Len pre dokumenty XML. Vyhovuje norme.

  Metóda createAttribute vytvorí nový objekt typu Attr a vráti naň ukazovateľ. Argument názov určuje názov atribútu, ktorý sa má vytvoriť. Nový objekt má atribút nodeName nastavený na name a atribúty localName , prefix a namespaceURI sú rovnaké nulový. Neskôr je možné vytvorený atribút priradiť k akémukoľvek prvku pomocou metódy Element.setAttributeNode.

  Príklad vytvorenia atribútu pre prvok HTML:

  Var myDiv = document.getElementById("idDiv"); var attr = document.createAttribute("temp"); attr.value = "(!JAZYK:dočasné"; myDiv.setAttributeNode(attr); alert(myDiv.getAttribute("temp"));!}

  Výstražné vyhlásenie vypíše reťazec dočasný.

  Príklad vytvorenia atribútu v Microsoft XMLDOM:

  Var xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async = false; xmlDoc.load("c:\Moje dokumenty\knihy.xml"); var root = xmlDoc.documentElement; var newAttr = xmlDoc.createAttribute("temp"); newAttr.value = "(!JAZYK:dočasné"; root.setAttributeNode(attr); alert(root.getAttribute("temp"));!}

  Výstražné vyhlásenie tu vytlačí aj reťazec dočasný .

  metóda createAttributeNS

  Syntax : dokument.createAttributeNS(namespaceURI, kvalifikovanýName) Argumenty: namespaceURI, kvalifikovanýName - typ výrazov Výsledok: nový objekt Attr Výnimky: INVALID_CHARACTER_ERR, NAMESPACE_ERR podpora: Nie je podporované. Nie je podporované.

  Metóda createAttributeNS vytvorí nový objekt typu Attr a vráti naň ukazovateľ. Je určený pre dokumenty XML a nemusí byť podporovaný pre dokumenty HTML. Argument namespaceURI určuje URI priestoru názvov a kvalifikovaný názov je kvalifikovaný názov vygenerovaného atribútu v tomto priestore názvov. Vytvorený objekt typu Attr má nasledujúce atribúty:

  Neskôr je možné vytvorený atribút priradiť k akémukoľvek prvku pomocou metódy Element.setAttributeNode.

  metóda createCDATASection

  Syntax : dokument.createCDATASection(data) Argumenty: dátovo-typový výraz Výsledok: nový objekt CDATASection Výnimky: NOT_SUPPORTED_ERR podpora: Vyhovuje norme. Vyhovuje norme.

  Metóda vytvorte sekciu CDATA vytvorí nový objekt typu CDATASection a vráti naň ukazovateľ. Je určený len pre XML dokumenty; pokus o jeho zavolanie v HTML DOM vyvolá výnimku NOT_SUPPORTED_ERR. Argument data špecifikuje obsah vygenerovaného. Príklad vytvorenia sekcie CDATA v Microsoft XMLDOM:

  Var xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async = false; xmlDoc.load("c:\Moje dokumenty\knihy.xml"); var root = xmlDoc.documentElement; var newSection = xmlDoc.createCDATASection("Ahoj svet!"); root.appendChild(newSection);

  metóda createComment

  Syntax : dokument.createComment(data) Argumenty: dátovo-typový výraz Výsledok: nový objekt komentára Výnimky: Nie podpora: Len pre dokumenty XML. Vyhovuje norme.

  Metóda vytvoriť komentár vytvorí nový objekt typu Comment a vráti naň ukazovateľ. Argument data špecifikuje obsah komentára, ktorý sa má vytvoriť. Príklad vytvorenia komentára v Gecko:

  Var root = document.documentElement.firstChild; var comm = document.createComment("Toto je komentár."); root.appendChild(comm);

  metóda createDocumentFragment

  Syntax : dokument.createDocumentFragment() Výsledok: nový objekt Výnimky: Nie podpora: Len pre dokumenty XML. Vyhovuje norme.

  Metóda createDocumentFragment vytvorí nový prázdny objekt typu a vráti naň ukazovateľ. Príklad vytvorenia fragmentu dokumentu v Gecko:

  Var elem = document.documentElement.firstChild; varo = document.createDocumentFragment(); elem.appendChild(o);

  metóda createElement

  Syntax : dokument.createElement(tagName) Argumenty:tagName - typ výrazu Výsledok: nový objekt prvku Výnimky: INVALID_CHARACTER_ERR podpora: Vyhovuje štandardu (Pozri poznámku 2). Vyhovuje norme.

  Metóda createElement vytvorí nový objekt typu Element a vráti naň ukazovateľ. Argument tagName určuje značku prvku, ktorý sa má vytvoriť. Nový objekt má atribút nodeName nastavený na tagName a atribúty localName , prefix a namespaceURI sú rovnaké nulový. Ak má objekt atribúty s predvolenými hodnotami, potom sa automaticky vytvoria príslušné uzly Attr a pridajú sa k prvku.

  Poznámky:

  1. V prípade XML sa v názvoch značiek prvkov rozlišujú veľké a malé písmená. V prípade HTML môžu byť špecifikované v každom prípade, ale pri vytváraní prvku sa skonvertujú na veľké písmená.
  2. Pokus o vytvorenie prvku v programe Internet Explorer FRAME alebo IFRAME vedie k závažnej chybe prehliadača alebo prinajmenšom k úplnému zničeniu stromu objektov dokumentu.

  Typ uzla	Správanie
  ATTRIBUTE_NODE	Atribút ownerElement je nulový, špecifikované je pravda. Všetci potomkovia pôvodného uzla sa rekurzívne skopírujú do nového uzla Attr, bez ohľadu na hodnotu deep .
  DOCUMENT_FRAGMENT_NODE	Ak je hlboký pravda, potom sa importuje zadaný fragment dokumentu; inak sa vytvorí prázdny uzol.
  DOCUMENT_NODE , DOCUMENT_TYPE_NODE	Nie je možné importovať.
  ELEMENT_NODE	Všetky atribúty zdrojového uzla sa skopírujú do nového uzla Element, okrem tých, ktoré sú štandardne nastavené v zdrojovom dokumente. Potom sa vytvoria predvolené atribúty akceptované v tomto dokumente pre prvky s týmto názvom. Ak je hlboký pravda, potom sa importuje celý podstrom pôvodného prvku.
  ENTITY_NODE	Uzly typu dokumentu entity
  ENTITY_REFERENCE_NODE	Skopíruje sa iba samotný uzol EntityReference bez ohľadu na hodnotu deep . Ak má náš dokument definíciu sekcie s daným názvom, potom sa vloží do nového uzla.
  NOTATION_NODE	Uzly notácie je možné importovať, ale v DOM 2 je objekt DocumentType len na čítanie, takže import takýchto uzlov nemá zmysel.
  PROCESSING_INSTRUCTION_NODE	Skopírujú sa hodnoty cieľových a údajových atribútov zdrojového uzla.
  TEXT_NODE, CDATA_SECTION_NODE, COMMENT_NODE	Skopírujú sa hodnoty atribútov údajov a dĺžky zdrojového uzla.