JavaScript-ում հանգույցների հետ աշխատանք
Ինչպես գիտեք, թեգերը կարող են պարունակել այլ թեգեր կամ, JavaScript-ի տերմինաբանությամբ ասած, DOM տարրերը կարող են պարունակել այլ DOM տարրեր: Բացի այդ, սակայն, դրանցում կարող են լինել մեկնաբանություններ և սովորական տեքստ: Մեկնաբանությունները, տեքստերը և DOM տարրերը միավորում են մեկ անվան տակ - հանգույցներ:
Ձեզ արդեն ծանոթ են firstElementChild,
lastElementChild,
nextElementSibling,
previousElementSibling
հատկությունները:
Այս հատկություններն աշխատում են հենց DOM տարրերի հետ,
անտեսելով մնացած հանգույցները: Որպես կանոն, հենց դա
էլ մեզ անհրաժեշտ է:
Սակայն, գոյություն ունեն նաև firstChild,
lastChild, nextSibling, previousSibling
հատկությունները:
Այս հատկություններն աշխատում են նմանապես,
սակայն, հաշվի առնելով բոլոր հանգույցները: Եկեք դիտարկենք
այս հատկությունների տարբերությունը օրինակով:
Ենթադրենք ունենք div, որն իր մեջ պարունակում է երեք հանգույց:
<div id="elem"><!--com-->text<span>tag</span></div>
Ստացենք այս div-ի հղումը փոփոխականում:
let elem = document.querySelector('#elem');
Եվ հիմա եկեք տեսնենք, թե ինչ է պարունակվում
firstChild և firstElementChild հատկություններում:
console.log(elem.firstChild); // մեկնաբանություն
console.log(elem.firstElementChild); // span թեգ
Գրեք կոդ, որ կցուցադրի lastChild և
lastElementChild-ի տարբերությունը:
Գրեք կոդ, որ կցուցադրի nextSibling և
nextElementSibling-ի տարբերությունը:
Գրեք կոդ, որ կցուցադրի previousSibling և
previousElementSibling-ի տարբերությունը:
