జావాస్క్రిప్ట్ హ్ట్మ్ల్ డొమ్ నోడ్ లిస్ట్

HTML DOM NodeList ఆబ్జెక్ట్

NodeList డాక్యుమెంట్ నుండి పొందబడిన నోడ్ లిస్ట్ కలిగిన ఆబ్జెక్ట్.

నోడ్ లిస్ట్ ఆబ్జెక్ట్ మరియు HTMLCollection ఆబ్జెక్ట్ లకు మిగతా పరిమితిలేదు.

నోడ్ లిస్ట్ ఆబ్జెక్ట్ మరియు HTMLCollection ఆబ్జెక్ట్ లకు మిగతా పరిమితిలేదు. నోడ్ లిస్ట్ ఆబ్జెక్ట్ మరియు HTMLCollection ఆబ్జెక్ట్ లకు మిగతా పరిమితిలేదు. getElementsByClassName()

అన్ని బ్రౌజర్లు ఈ మాథోడ్ ను ప్రదర్శిస్తాయి. కొన్ని (పాత) బ్రౌజర్లు నోడ్ లిస్ట్ ఆబ్జెక్ట్ ను ప్రదర్శిస్తాయి కాకుండా HTMLCollection ను ప్రదర్శిస్తాయి. childNodes ఈ అట్రిబ్యూట్ ను ప్రదర్శిస్తాయి.

అన్ని బ్రౌజర్లు ఈ అట్రిబ్యూట్ ను ప్రదర్శిస్తాయి. querySelectorAll() ఈ మాథోడ్ నోడ్ లిస్ట్ ఆబ్జెక్ట్ ను ప్రదర్శిస్తుంది.

డాక్యుమెంట్ లోని అన్ని <p> మెటాడాటాలను ఎంపిక చేసే కోడ్ ఈ కింది విధంగా ఉంటుంది:

ఉదాహరణ

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

亲自试一试

నోడ్ లిస్ట్ లోని మెటాడాటాలను సంఖ్యా క్రమంలో ప్రాప్తించవచ్చు.

రెండవ <p> నోడ్ ను ప్రాప్తించడానికి మీరు ఇలా రాయవచ్చు:

y = myNodeList[1];

ప్రకటనలు:ఇండెక్స్ ప్రారంభం 0 నుండి ఉంటుంది.

HTML DOM నోడ్ లిస్ట్ పొడవు

length నోడ్ లిస్ట్ లోని నోడ్స్ సంఖ్యను నిర్వచిస్తుంది:

ఉదాహరణ

var myNodelist = document.querySelectorAll("p");
document.getElementById("demo").innerHTML = myNodelist.length;

亲自试一试

ఉదాహరణ వివరణం:

  • అన్ని <p> మెటాడాటాల జాబితాను సృష్టించు
  • ఈ జాబితా పొడవును చూపించు

length మీరు నోడ్ లిస్ట్ లోని నోడ్స్ ను స్క్రూబింగ్ చేయడానికి అనువు వాటి స్పెసిఫిక్ అట్రిబ్యూట్స్ ఉపయోగపడతాయి:

ఉదాహరణ

ప్రతి <p> మెటాడాటా కి బ్యాక్‌గ్రౌండ్ కలర్ మార్చండి:

var myNodelist = document.querySelectorAll("p");
var i;
for (i = 0; i < myNodelist.length; i++) {
    myNodelist[i].style.backgroundColor = "red";
}

亲自试一试

HTMLCollection 与 NodeList 的区别

HTMLCollection（前一章）是 HTML 元素的集合。

NodeList 是文档节点的集合。

NodeList 和 HTML 集合几乎完全相同。

HTMLCollection 和 NodeList 对象都是类数组的对象列表（集合）。

它们都有定义列表（集合）中项目数的 length 属性。

它们都可以通过索引 (0, 1, 2, 3, 4, ...) 像数组那样访问每个项目。

访问 HTMLCollection 项目，可以通过它们的名称、id 或索引号。

访问 NodeList 项目，只能通过它们的索引号。

只有 NodeList 对象能包含属性节点和文本节点。

节点列表不是数组！

节点数组看起来像数组，但并不是。

您能够遍历节点列表并像数组那样引用其节点。

不过，您无法对节点列表使用数组方法，比如 valueOf()、push()、pop() 或 join()。