关于DOM集合接口，主要不同在于HTMLCollection是元素集合而NodeList是节点集合（既包括元素，也包括节点）。

规定一下结果是：

. node.childNodes 结果返回类型是 NodeList，

. node.children 结果返回类型是 HTMLCollection

. node（document或者其他不同节点）.getElementsByXXX 结果返回类型是HTMLCollection

唯一要注意的是 querySelectorAll 返回的是 NodeList ，但是实际上是元素集合，并且是静态的，

其他接口返回的HTMLCollection和NodeList都是动态的，即取得的结果会随着相应元素的增减而增减。

PS：《JS权威指南第六版》关于getElementByName() 和 getElementsByTagName() 都返回 NodeList 对象，是不对的，

规定都返回 HTMLCollection对象。

NodeList和HTMLCollection区别的更多相关文章

  1. querySelector()与querySelectorAll()的区别及NodeList和HTMLCollection对象的区别

    querySelector().Document.Element类型均可调用该方法. 当用Document类型调用querySelector()方法时,会在文档元素范围内查找匹配的元素:而当用Elem ...

  2. 深入理解javascript中的动态集合——NodeList、HTMLCollection和NamedNodeMap

    × 目录 [1]NodeList [2]HTMLCollection [3]NamedNodeMap[4]注意事项 前面的话 一说起动态集合,多数人可能都有所了解.但是,如果再深入些,有哪些动态集合, ...

  3. NodeList、HTMLCollection和NamedNodeMap

    上篇文章以arguments为例讲到了类数组对象,这篇我们讨论更多的类数组对象NodeList.HTMLCollection和NamedNodeMap.既然是类数组对象,这3种对象也都能应用上篇文章中 ...

  4. javascript高级程序设计---NodeList和HTMLCollection

    节点对象都是单个节点,但是有时会需要一种数据结构,能够容纳多个节点.DOM提供两种接口,用于部署这种节点的集合分别是NodeList和HTMLCollection MDN上的定义: NodeList: ...

  5. DOM中的NodeList与HTMLCollection

    最近在看<Javascript高级程序设计>的时候,看到了这样一句话:“理解NodeList和HTMLCollection,是从整体上透彻理解DOM的关键所在.”,所以觉得应该写一篇关于N ...

  6. 无法转换json问题 Error: Model.nodeDataArray value is not an instance of Array or NodeList or HTMLCollection

    var jsonobj=eval('('+t+')'); 使用eval 函数,讲后台json字符串转换为前台jsarray数组. 如果使用 ajax不会出现这种情况,因为会自动转换. 但是如果直接从后 ...

  7. JS权威指南读书笔记（六）

    第十五章 脚本化文档   1 文档对象模型(DOM)是表示和操作HTML和XML文档内容的基础API. 2 文档节点的部分层次结构 Text和CDATASection都是characterData的子 ...

  8. 原生DOM探究 -- NodeList v.s. HTMLCollection

    涉及获取元素的主要API 在获取原生DOM元素的时候,主要涉及这几个DOM API(链接为Living Standard): Node及对应集合NodeList Element(继承Node)及对应集 ...

  9. (85)Wangdao.com第十八天_JavaScript NodeList 接口，HTMLCollection 接口

    NodeList 接口        HTMLCollection 接口 节点都是单个对象,有时需要一种数据结构,能够容纳多个节点 DOM 提供两种节点集合,用于容纳多个节点:NodeList 和 H ...

随机推荐

  1. php环境选择

    第一个    PHPStudy 推荐这个.简单好用. 链接:https://pan.baidu.com/s/1yWRDjfnadkkUE-JX5pqZmg 提取码:4imw 第二个 PHPnow 第三 ...

  2. 【Leetcode_easy】914. X of a Kind in a Deck of Cards

    problem 914. X of a Kind in a Deck of Cards 题意:每个数字对应的数目可以均分为多组含有K个相同数目该数字的数组. 思路:使用 map 结构记录数组中每个元素 ...

  3. 【Leetcode_easy】852. Peak Index in a Mountain Array

    problem 852. Peak Index in a Mountain Array solution1: class Solution { public: int peakIndexInMount ...

  4. C# .NET WINFORM MUTEX 互斥

    static class Program 里的全局变量: static System.Threading.Mutex appMutex; Main 方法里的内容: string exeName = & ...

  5. 继400G后，QSFP-DD800G会是下一个风口吗？

    数据中心市场作为光通信企业的主要战场,近三年400G的热度一直都在持续,虽有Facebook F16继续选用100G架构给市场泼了一些冷水等插曲存在,但近日随着阿里巴巴硅光400G QSFP-DD D ...

  6. 【GStreamer开发】GStreamer播放教程01——playbin2的使用

    目标 我们前面已经使用过了playbin2这个element,它可以让我们做的很少而实现很多.本教程会展示当这个element的默认设置在一些特殊情形下不符合我们的需求是可以做的一些深度定制,我们会看 ...

  7. KVM虚拟机两种配置的概念不同之处

    KVM虚拟机配置的两种方式之间的不同之处 NAT方式 NAT模式中,让虚拟机借助NAT(网络地址转换)功能,通过宿主机器所在的网络来访问公网. NAT模式中,虚拟机的网卡和物理网卡的网络,不在同一个网 ...

  8. Linux DHCP 服务器配置与管理

    一.环境介绍: 运行软件:VMware Workstation Pro 14 系统环境:CentOS-7-x86_64-1810 二.操作配置: 1.DHCP 服务器搭建 1)安装DHCP yum i ...

  9. python selenium学习

    selenium是一个python模块,具有自动化模拟浏览器的功能 selenium的中文文档地址:http://selenium-python-zh.readthedocs.io/en/latest ...

  10. [bzoj3420]Poi2013 Triumphal arch_树形dp_二分

    Triumphal arch 题目链接:https://lydsy.com/JudgeOnline/problem.php?id=3420 数据范围:略. 题解: 首先,发现$ k $具有单调性,我们 ...