Ingebouwde DOM Klassen JavaScript

DOM elementen zijn ook objecten van ingebouwde klassen. Laten we een voorbeeld bekijken. Stel we hebben een paragraaf:

html<p>tekst</p>

We halen een referentie erop in een variabele:

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

Laten we deze paragraaf naar de console uitvoeren:

javascriptconsole.log(elem);

En laten we nu de lijst van eigenschappen en methodes van onze paragraaf bekijken:

javascriptconsole.dir(elem);

We kunnen bepalen tot welke klasse onze paragraaf behoort. Hiervoor moeten we in de lijst van eigenschappen de speciale eigenschap [[Prototype]] zoeken. Hierin zien we dat de paragraaf tot de klasse HTMLParagraphElement behoort. Laten we dit controleren:

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

Задание 1

Bestudeer het resultaat van de uitvoering van de volgende code:

html<div>tekst</div>

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

Bepaal tot welke klasse deze tag behoort.

Задание 2

Bestudeer het resultaat van de uitvoering van de volgende code:

html<input>

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

Bepaal tot welke klasse deze tag behoort.

Задание 3

Bestudeer het resultaat van de uitvoering van de volgende code:

html<div>tekst</div>
<div>tekst</div>
<div>tekst</div>

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

Bepaal tot welke klasse het resultaat behoort.

Задание 4

Bestudeer het resultaat van de uitvoering van de volgende code:

html<div>
  <p>tekst</p>
  <p>tekst</p>
  <p>tekst</p>
</div>

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

console.dir(elems);

Bepaal tot welke klasse het resultaat behoort.