×
COOKIES
Prezeraním tejto stránky dochádza k spracovaniu cookies. Spracovaniu cookies zabránite v nastaveniach internetového prehliadača alebo nezobrazovaním tejto stránky v internetovom prehliadači.
Informačný web Mateja Lednára
Vytvárame riešenia

Ako zobraziť vlastnosti uzla

Pri práci s DOM potrebuje developer neustále rýchly prístup k vlastnostiam a metódam jednotlivých objektov. Z tohto pohľadu nastala pred časom v nástroji Developer Tools v prehliadači Google Chrome zmena, ktorá spôsobuje, že pri práci s uzlami sa namiesto vlastností a metód vypisuje daný uzol.
Na jednu stranu je to rýchly prístup k získaným dátam, na druhú stranu pre tých čo si zvykli na pôvodné zobrazenie môže byť táto funkcionalita nežiadúca. Mne osobne tento prístup vyhovuje, no keďže poznám objekt console, hneď som skúsil zadať príkaz pre pôvodné zobrazenie.
Príklad: HTML kód.
1
2
3
4
5
6
7
8
<nav id="display">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</nav>
Príklad: JavaScript kód.
1
2
var Node = document.getElementById("display");
console.log(Node);
Obrázok: Výsledok výstupu v Google Chrome.
Výsledok výstupu v Google Chrome.
Obrázok: Výsledok výstupu v Internet Exploreri.
Výsledok výstupu v Internet Exploreri.
Pre zobrazenie podrobností o objekte stačí do konzoly Internet Explorera zadať iba názov objektu (v tomto prípade Node) a pre výpis všetkých vlastností a metód kliknúť na odkaz Pridať na sledovanie.
Obrázok: Podrobný výpis vlastností a metód uzla v Internet Exploreri.
Podrobný výpis vlastností a metód uzla v Internet Exploreri.
Zobrazenie uzla, tak ako ho zobrazuje v súčasnosti Google Chrome, je možné cez zápis do konzoly Node.outerHTML. No vráťme sa späť k Developer Tools pre Google Chrome. Ak chce developer výpis vlastností a metód uzla, musí aplikovať metódu dir().
Príklad: Výpis vlastností a metód uzla.
1
2
var Node = document.getElementById("display");
console.dir(Node);
Obrázok: Výsledok výstupu v Google Chrome.
Výsledok výstupu v Google Chrome.
Metóda dir() funguje nielen v Google Chrome, ale je ju možné bez problémov používať aj v Internet Exploreri. Rozdiel je v tom, že kým Google Chrome podporuje zbaľovanie a rozbaľovanie vnorených objektov, Internet Explorer vypíše fixný zoznam. Pre zbaľovanie a rozbaľovanie objektov je potrebné použiť sledovanie objektu.

Záver

Objekt console ponúka aj ďalšie metódy, ktoré stojí za to spoznať. Do budúcna plánujem napísať článok ako postupovať, ak prehliadač objekt console nepodporuje a ako si vytvoriť vlastnú konzolu.
Autor: Matej Lednár
Dátum: 10.12.2012
Kategória: Programovanie
Značky: javascript, programovanie
Programovanie,JavaScript,programovanie
Žiadna časť tohto článku nesmie byť reprodukovaná bez uvedenia autora a URL na túto stránku.
Viac informácií nájdete v sekcii O projekte.

Komentáre

Článok neobsahuje zatiaľ žiadne komentáre.

Pridať komentár

Meno (povinné)
Web
Správa (povinné)
Odoslať
Od najnovších