Фарқият байни намудҳои ҷадвалҳои қалбакӣ дар JavaScript

Фарқият байни ду намуди ҷадвалҳои қалбакӣ дар рафтори гуногун ҳангоми тағйир додани унсурҳои DOM аст. Бигзор, масалан, мо коллексияи абзасҳоро дар шакли HTMLCollection ва дар шакли NodeList гирифтаем. Сипас мо абзаси дигар эҷод карда, ба DOM-и худ илова мекунем. Дар ин ҳолат, он ба таври худкор дар HTMLCollection пайдо мешавад, аммо коллексияи NodeList бе тағйирот хоҳад монд.

Биёед ба мисол нигарем. Бигзор мо як див дошта бошем, ва дар он абзасҳо бошанд. Див ва ҳамон абзасҳоро дар шакли коллексияҳои ду намуди гуногун ба даст меорем:

let parent = document.querySelector('div');
let elems1 = document.getElementsByTagName('p'); // HTMLCollection
let elems2 = document.querySelectorAll('p');     // NodeList

Абзаси дигар ба диви худ илова мекунем:

let p = document.createElement('p');
parent.append(p);

Дар натиҷа, яке аз коллексияҳо тағйир меёбад, ва дуввумӣ - на:

console.log(elems1); // 4 абзас - бо нави
console.log(elems2); // 3 абзаси ибтидоӣ

Санҷед, ки хосият children ҳангоми илова кардани унсури нав чӣ гуна рафтор хоҳад кард.

Санҷед, ки хосият childNodes ҳангоми илова кардани унсури нав чӣ гуна рафтор хоҳад кард.