Hiërargie van ingeboude klasse in OOP in JavaScript

Ingeboude klasse het ook 'n hiërargie. Kom ons kyk na 'n voorbeeld van 'n paragraaf:

html<p>teks</p>

Kry 'n verwysing na die paragraaf in 'n veranderlike:

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

Laat ons na ons paragraaf in die konsole kyk:

javascriptconsole.dir(elem);

Soos jy reeds weet, bevat die eienskap [[Prototype]] die naam van die klas van die paragraaf. Dit is HTMLParagraphElement. As jy die lys van eienskappe en metodes van hierdie klas uitvou, sal daar onderaan weer 'n eienskap [[Prototype]] wees, wat sal bevat reeds die ouerklas en dit sal HTMLElement wees. Vir dit kan ook 'n ouer gevind word en so voort.

Задание 1

Bestudeer die hiërargie van klasse vir hierdie etiket:

html<div>teks</div>

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

Задание 2

Bestudeer die hiërargie van klasse vir hierdie etiket:

html<input>

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

Задание 3

Bestudeer die hiërargie van klasse vir hierdie versameling:

html<div>teks</div>
<div>teks</div>
<div>teks</div>

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

Задание 4

Bestudeer die hiërargie van klasse vir hierdie versameling:

html<div>
  <p>teks</p>
  <p>teks</p>
  <p>teks</p>
</div>

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

console.dir(elems);