Hierarhija vgrajenih razredov v OOP v JavaScript

Tudi vgrajeni razredi imajo hierarhijo. Poglejmo si na primeru odstavka:

html<p>text</p>

Pridobimo referenco na odstavek v spremenljivko:

javascriptlet elem = document.querySelector('p');

Poglejmo si naš odstavek v konzoli:

javascriptconsole.dir(elem);

Kot že veste, v lastnosti [[Prototype]] vsebuje ime razreda odstavka. To je HTMLParagraphElement. Če razširite seznam lastnosti in metod tega razreda, potem spodaj spet odkrijete lastnost [[Prototype]], ki bo vsebovala že nadrejeni razred in to bo HTMLElement. Zanj je mogoče najti tudi nadrejenega in tako naprej.

Задание 1

Preučite hierarhijo razredov za to oznako:

html<div>text</div>

javascriptlet elem = document.querySelector('div');
console.dir(elem);

Задание 2

Preučite hierarhijo razredov za to oznako:

html<input>

javascriptlet elem = document.querySelector('input');
console.dir(elem);

Задание 3

Preučite hierarhijo razredov za to zbirko:

html<div>text</div>
<div>text</div>
<div>text</div>

javascriptlet elems = document.querySelectorAll('div');
console.dir(elems);

Задание 4

Preučite hierarhijo razredov za to zbirko:

html<div>
  <p>text</p>
  <p>text</p>
  <p>text</p>
</div>

javascriptlet elem = document.querySelector('div');
let elems = elem.children;

console.dir(elems);