JavaScript-da düwünler bilen işleşiş

Bilşiňiz ýaly, teglar başga teglary ýa-da JavaScript terminologiýasynda aýdylanda, DOM elementleri başga DOM elementlerini öz içine alyp biler. Şonuň ýaly-da, olaryň içinde düşündirişler we adaty tekst bolup biler. Düşündirişler, tekstler we DOM elementleri bir at bilen birleşdirilýär - düwünler.

Size firstElementChild, lastElementChild, nextElementSibling, previousElementSibling hasiýetleri tanyş. Bu hasiýetler ýöne DOM elementleri bilen işleýär, beýleki düwünleri hasaba almaz. Esasan, bizim talap edýänimiz hem şondur.

Emma, firstChild, lastChild, nextSibling, previousSibling hasiýetleri hem bar. Bu hasiýetler şuňa meňzeş işleýär, ýöne, ähli düwünleri hasaba alýar. Geliň bu hasiýetleriň arasyndaky tapawudy mysalda görüň. Bizde üç düwünden ybarat bolan bir div bolsun:

html<div id="elem"><!--com-->text<span>tag</span></div>

Bu düwe salgysyny üýtgeýjide alyň:

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

Indi firstChild we firstElementChild hasiýetlerinde näme bardygyna seredeliň:

javascriptconsole.log(elem.firstChild);        // düşündiriş
console.log(elem.firstElementChild); // span tegi