JavaScriptin sisäänrakennetut DOM-luokat

DOM-elementit edustavat myös sisäänrakennettujen luokkien olioita. Katsotaanpa esimerkkiä. Oletetaan, että meillä on kappale:

html<p>teksti</p>

Saadaan viittaus siihen muuttujaan:

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

Tulostetaan tämä kappale konsoliin:

javascriptconsole.log(elem);

Katsotaanpa nyt luettelo kappaleemme ominaisuuksista ja menetelmistä:

javascriptconsole.dir(elem);

Voidaan määrittää mihin luokkaan kappaleemme kuuluu. Tätä varten ominaisuuksien luettelosta on löydettävä erityinen ominaisuus [[Prototype]]. Siinä me näemme, että kappale kuuluu luokkaan HTMLParagraphElement. Tarkistetaan tämä:

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

Задание 1

Tutki seuraavan koodin suorituksen tulosta:

html<div>teksti</div>

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

Määritä, mihin luokkaan tämä tagi kuuluu.

Задание 2

Tutki seuraavan koodin suorituksen tulosta:

html<input>

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

Määritä, mihin luokkaan tämä tagi kuuluu.

Задание 3

Tutki seuraavan koodin suorituksen tulosta:

html<div>teksti</div>
<div>teksti</div>
<div>teksti</div>

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

Määritä, mihin luokkaan tulos kuuluu.

Задание 4

Tutki seuraavan koodin suorituksen tulosta:

html<div>
  <p>teksti</p>
  <p>teksti</p>
  <p>teksti</p>
</div>

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

console.dir(elems);

Määritä, mihin luokkaan tulos kuuluu.