Atšķirība starp pseido masīvu tipiem JavaScript

Atšķirība starp diviem pseido masīvu tipiem ir atšķirīgā uzvedībā, mainot DOM elementus. Pieņemsim, ka mēs esam saņēmuši kolekciju rindkopu kā HTMLCollection un kā NodeList. Tad mēs izveidosim un pievienosim vēl vienu rindkopu mūsu DOM. Šajā gadījumā tas automātiski parādīsies HTMLCollection, bet kolekcija NodeList paliks nemainīga.

Apskatīsim piemērā. Pieņemsim, ka mums ir div, un tajā atrodas rindkopas. Iegūsim mūsu div un vienas un tās pašas rindkopas kā kolekcijas divos dažādos tipos:

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

Pievienosim vēl vienu rindkopu mūsu div:

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

Rezultātā viena no kolekcijām mainīsies, bet otrā - nē:

console.log(elems1); // 4 rindkopas - ar jauno
console.log(elems2); // 3 sākotnējās rindkopas

Pārbaudiet, kā uzvedīsies īpašība children pievienojot jaunu elementu.

Pārbaudiet, kā uzvedīsies īpašība childNodes pievienojot jaunu elementu.