HTML DOM NodeList Reference Manual

NodeList

Ang NodeList ay isang koleksyon ng mga node na katulad ng array (list).

Ang mga node sa NodeList ay maaaring abutin sa pamamagitan ng index (mula sa 0).

Ayon sa length na katangianIbabalik ang bilang ng mga node sa NodeList.

NodeList vs. HTMLCollection

NodeList at HTMLCollection Halos pareho.

Tingnan ang paglalarawan sa ibaba ng pahina.

Saan nagbibigay ng NodeList?

childNodes attribute

querySelectorAll() method

getElementsByName() method

Katangian at mga paraan

Maaaring gamitin ang mga sumusunod na katangian at mga paraan sa NodeList:

Pangalan Paglalarawan
entries() Ibabalik ang iterator na may key/value pair mula sa listahan.
forEach() Gumawa ng callback function para sa bawat node sa listahan.
item() Ibabalik ang node na nasa naung index.
keys() Ibabalik ng halimbawa ang iterator gamit ang mga key sa listahan.
length Ibabalik ang bilang ng mga node sa NodeList.
values() Ibabalik ng halimbawa ang iterator gamit ang mga halaga sa listahan.

mga halimbawa

Pinili ang lahat ng <p> Node:

const myNodeList = document.querySelectorAll("p");

Ang mga element sa NodeList ay maaaring abutin sa pamamagitan ng index number.

Kung nais mong abutin ang ikalawang <p> node, maaari mong isulat:

myNodeList[1]

Subukan nang personal

Pagsasalita:Ang index ay nagsisimula sa 0.

HTML DOM Node List Length

length Ang katangian ay naglalagay ng bilang ng mga node sa listahan ng node:

Halimbawa 1

myNodelist.length

Subukan nang personal

Kung nais mong suriin ang lahat ng node sa listahan ng node:length Ang katangian ay magagamit:

Halimbawa 2

Ayusina ang kulay ng lahat ng <p> element sa listahan ng node:

const myNodelist = document.querySelectorAll("p");
magpakita (let i = 0; i < myNodelist.length; i++) {
  myNodelist[i].style.color = "red";
}

Subukan nang personal

Hindi ito isang array

Hindi ito isang array!

Ang NodeList ay mukhang isang array, ngunit hindi ito tulad ng iyon.

Maaari kang magpasukang sa NodeList at gamitin ang index reference sa kanyang mga node.

Ngunit hindi mo magagamit ang mga Array na method sa NodeList, tulad ng push(), pop() o join().

Pagkakaiba ng HTMLCollection at NodeList

NodeList sa HTMLcollection Napakatulad.

Ang dalawa ay parehong mula sa dokumento na inaakalang isang koleksyon ng katulad ng array ng mga node (elemento) na puwedeng ma-access sa pamamagitan ng index number. Ang index ay mula sa 0.

Ang dalawa ay may katulad na pagkakakilanlan. Ayon sa length na katangianna ibibigay ang bilang ng mga elemento sa listahan (koleksyon).

Ang HTMLCollection ayElementong dokumentoang koleksyon ng

Ang NodeList ayNodo ng dokumentoang koleksyon ng (element node, attribute node at text node).

Ang item ng HTMLCollection ay puwedeng ma-access sa pamamagitan ng kanilang pangalan, id o index number.

Ang item ng NodeList ay puwedeng ma-access sa pamamagitan ng kanilang index number.

Ang HTMLCollection palaging isangAktwalkoleksyon. Halimbawa: Kung idinagdag ang elemento na <li> sa listahan sa DOM, ang listahan sa HTMLCollection ay magbabago.

Ang NodeList ay karaniwang isangStatikAyon sa koleksyon. Halimbawa: Kung idinagdag ang elemento na <li> sa listahan sa DOM, ang listahan sa NodeList ay hindi magbabago.

getElementsByClassName() at getElementsByTagName() Ang paraan ay ibibigay ang isang aktwal na HTMLCollection.

querySelectorAll() Ang paraan ay ibibigay ang isang statik na NodeList.

childNodes Ang paraan ay ibibigay ang isang aktwal na NodeList.

aktwal na listahan ng mga node

Sa ilang mga kaso, ang NodeList ayAktwal：Ang pagbabago sa DOM ay magsasauli sa NodeList.

childNodes Ang paraan ay ibibigay ang isang aktwal na NodeList.