Eingebaute DOM-Klassen in JavaScript

DOM-Elemente stellen ebenfalls Objekte eingebauter Klassen dar. Schauen wir uns ein Beispiel an. Nehmen wir an, wir haben einen Absatz:

<p>text</p>

Holen wir uns eine Referenz darauf in eine Variable:

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

Geben wir diesen Absatz in der Konsole aus:

console.log(elem);

Schauen wir uns nun die Liste der Eigenschaften und Methoden unseres Absatzes an:

console.dir(elem);

Man kann bestimmen, zu welcher Klasse unser Absatz gehört. Dafür muss in der Eigenschaftenliste nach der speziellen Eigenschaft [[Prototype]] gesucht werden. Darin sehen wir, dass der Absatz zur Klasse HTMLParagraphElement gehört. Prüfen wir das:

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

Untersuchen Sie das Ergebnis der Ausführung des folgenden Codes:

<div>text</div>

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

Bestimmen Sie, zu welcher Klasse dieses Tag gehört.

Untersuchen Sie das Ergebnis der Ausführung des folgenden Codes:

<input>

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

Bestimmen Sie, zu welcher Klasse dieses Tag gehört.

Untersuchen Sie das Ergebnis der Ausführung des folgenden Codes:

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

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

Bestimmen Sie, zu welcher Klasse das Ergebnis gehört.

Untersuchen Sie das Ergebnis der Ausführung des folgenden Codes:

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

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

console.dir(elems);

Bestimmen Sie, zu welcher Klasse das Ergebnis gehört.