Werk met nodusse in JavaScript
Soos jy weet, kan etikette ander etikette bevat of, in JavaScript-terme, DOM elemente kan ander DOM-elemente bevat. Daarbenewens kan daar egter ook kommentaar en gewone teks in hulle wees. Kommentaar, teks en DOM elemente word saamgevat onder een naam - nodusse.
Jy is reeds bekend met die eienskappe firstElementChild,
lastElementChild,
nextElementSibling,
previousElementSibling.
Hierdie eienskappe werk spesifiek met DOM-elemente,
en ignoreer die ander nodusse. Gewoonlik is dit presies
wat ons nodig het.
Daar is egter ook eienskappe firstChild,
lastChild, nextSibling, previousSibling.
Hierdie eienskappe werk op 'n soortgelyke manier,
maar neem alle nodusse in ag. Kom ons kyk na die
verskil tussen hierdie eienskappe met 'n voorbeeld.
Laat ons 'n div hê wat drie nodusse bevat:
<div id="elem"><!--com-->text<span>tag</span></div>
Kry 'n verwysing na hierdie div in 'n veranderlike:
let elem = document.querySelector('#elem');
En laat ons nou kyk wat bevat word
in die eienskappe firstChild en firstElementChild:
console.log(elem.firstChild); // kommentaar
console.log(elem.firstElementChild); // span-etiket
Skryf kode wat die verskil sal toon tussen
lastChild en lastElementChild.
Skryf kode wat die verskil sal toon tussen
nextSibling en nextElementSibling.
Skryf kode wat die verskil sal toon tussen
previousSibling en previousElementSibling.