Kufanya Kazi na Nodes katika JavaScript
Kama unavyojua, vitambulisho vinaweza kuwa na vitambulisho vingine ndani yake au, kusema kwa istilahi za JavaScript, vipengele vya DOM vinaweza kuwa na vipengele vingine vya DOM. Lakini zaidi ya hayo, vinaweza kuwa na maoni na maandishi ya kawaida. Maoni, maandishi na vipengele vya DOM vinaunganishwa kwa jina moja - nodes.
Tayari unafahamu sifa za firstElementChild,
lastElementChild,
nextElementSibling,
previousElementSibling.
Sifa hizi hufanya kazi hasa na vipengele vya DOM,
zikipuuza nodes zingine. Kwa kawaida, hii ndio
tunayohitaji.
Hata hivyo, pia kuna sifa firstChild,
lastChild, nextSibling, previousSibling.
Sifa hizi hufanya kazi kwa njia ile ile,
lakini, zikizingatia nodes zote. Hebu tuone
tofauti kati ya sifa hizi kwa kutumia mfano.
Hebu tuchukulie tuna div, iliyo na nodes tatu ndani yake:
<div id="elem"><!--com-->maandishi<span>kitambulisho</span></div>
Tupate kiungo kwenye div hii kwenye kutofautisha:
let elem = document.querySelector('#elem');
Sasa hebu tuone nini kimo
katika sifa firstChild na firstElementChild:
console.log(elem.firstChild); // maoni
console.log(elem.firstElementChild); // kitambulisho span
Andika msimbo ambao utaonyesha tofauti kati ya
lastChild na lastElementChild.
Andika msimbo ambao utaonyesha tofauti kati ya
nextSibling na nextElementSibling.
Andika msimbo ambao utaonyesha tofauti kati ya
previousSibling na previousElementSibling.
