Ingeboude DOM Klasse in JavaScript

DOM elemente verteenwoordig ook voorwerpe van ingeboude klasse. Kom ons kyk na 'n voorbeeld. Laat ons 'n paragraaf hê:

html<p>teks</p>

Kry 'n verwysing daarna in 'n veranderlike:

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

Voer hierdie paragraaf in die konsole uit:

javascriptconsole.log(elem);

En kyk nou na die lys van eienskappe en metodes van ons paragraaf:

javascriptconsole.dir(elem);

Jy kan bepaal tot watter klas ons paragraaf behoort. Vir dit in die eienskappe lys moet jy 'n spesiale eienskap [[Prototype]] vind. Daarin sien ons dat die paragraaf aan die klas HTMLParagraphElement behoort. Kom ons toets dit:

javascriptconsole.log(elem instanceof HTMLParagraphElement); // waar

Задание 1

Bestudeer die resultaat van die uitvoering van die volgende kode:

html<div>teks</div>

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

Bepaal aan watter klas hierdie etiket behoort.

Задание 2

Bestudeer die resultaat van die uitvoering van die volgende kode:

html<input>

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

Bepaal aan watter klas hierdie etiket behoort.

Задание 3

Bestudeer die resultaat van die uitvoering van die volgende kode:

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

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

Bepaal aan watter klas die resultaat behoort.

Задание 4

Bestudeer die resultaat van die uitvoering van die volgende kode:

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

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

console.dir(elems);

Bepaal aan watter klas die resultaat behoort.