JavaScript-də qovşaq(lar)la iş
Bildiyiniz kimi, teqlər digər teqləri ehtiva edə bilər və ya JavaScript terminologiyasında desək, DOM elementləri digər DOM elementlərini ehtiva edə bilər. Bundan əlavə, onlarda şərhlər və adi mətn ola bilər. Şərhlər, mətnlər və DOM elementləri bir adla birləşdirilir - qovşaqlar.
Sizə artıq firstElementChild,
lastElementChild,
nextElementSibling,
previousElementSibling
xassələri tanışdır.
Bu xassələr xüsusilə DOM elementləri ilə işləyir,
qalan qovşaqlara məhəl qoymur. Bir qayda olaraq, bizə
məhz bu lazım olur.
Lakin, firstChild,
lastChild, nextSibling, previousSibling
xassələri də mövcuddur.
Bu xassələr oxşar şəkildə işləyir,
lakin, bütün qovşaqları nəzərə alır. Gəlin
bu xassələr arasındakı fərqi bir nümunə ilə görək.
Tutaq ki, bizim içində üç qovşaq olan bir div-imiz var:
<div id="elem"><!--com-->text<span>tag</span></div>
Gəlin bu div-ə dəyişəndə istinad əldə edək:
let elem = document.querySelector('#elem');
İndi gəlin firstChild və firstElementChild
xassələrində nə olduğuna baxaq:
console.log(elem.firstChild); // şərh
console.log(elem.firstElementChild); // span teqi
lastChild və lastElementChild arasındakı fərqi
göstərən kodu yazın.
nextSibling və nextElementSibling arasındakı fərqi
göstərən kodu yazın.
previousSibling və previousElementSibling arasındakı fərqi
göstərən kodu yazın.
