JavaScript-da OOP-da Ichki Klasslar Ierarxiyasi

Ichki klasslar ham ierarxiyaga ega. Keling, paragraf misolida ko'rib chiqaylik:

html<p>matn</p>

Paragrafga havolani o'zgaruvchiga olaylik:

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

Paragrafimizni konsolda ko'ramiz:

javascriptconsole.dir(elem);

Bilganingizdek, [[Prototype]] xususiyatida paragraf klassining nomi mavjud. Bu HTMLParagraphElement. Agar bu klassning xususiyatlari va metodlari ro'yxatini kengaytirsak, pastdan yana [[Prototype]] xususiyatini topamiz, unda ota-klass bo'ladi va bu HTMLElement bo'ladi. Uning uchun ham otasini topish mumkin va hokazo.

Задание 1

Ushbu teg uchun klasslar ierarxiyasini o'rganing:

html<div>matn</div>

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

Задание 2

Ushbu teg uchun klasslar ierarxiyasini o'rganing:

html<input>

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

Задание 3

Ushbu kolleksiya uchun klasslar ierarxiyasini o'rganing:

html<div>matn</div>
<div>matn</div>
<div>matn</div>

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

Задание 4

Ushbu kolleksiya uchun klasslar ierarxiyasini o'rganing:

html<div>
  <p>matn</p>
  <p>matn</p>
  <p>matn</p>
</div>

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

console.dir(elems);