和 NodeList 类似, HTMLCollection 也是一个 类数组对象, 和NodeList不同的是, 它是各种 元素节点 的集合, 且不具有 forEach() 方法, 因此如果不转为真正的数组, 则只能用 for 去遍历.

会返回 HTMLCollection 对象的属性方法包括: document.links / document.forms / document.images / document.getElementsByXXX() / 等, 在实际开发中, 碰到HTMLCollection 的概率会比 NodeList 要更多.

document.getElementsByTagName('div') instanceof HTMLCollection

// true

document.querySelectorAll('div') instanceof NodeList

// true

以上两个方法获取页面上所有 div 元素节点, 不过前者(document.getElementsByTagName)要更快, 因为它只在元素节点里面找, 而后者是在7种节点类型里面找.

怎样理解HTMLCollection接口的更多相关文章

  1. 我对面向对象设计的理解——Java接口和Java抽象类

    在没有好好地研习面向对象设计的设计模式之前,我对Java接口和Java抽象类的认识还是很模糊,很不可理解. 刚学Java语言时,就很难理解为什么要有接口这个概念,虽说是可以实现所谓的多继承,可一个只有 ...

  2. Golang 入门系列（四）如何理解interface接口

    前面讲了很多Go 语言的基础知识,包括go环境的安装,go语言的语法等,感兴趣的朋友,可以先看看之前的文章.https://www.cnblogs.com/zhangweizhong/category ...

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

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

  4. vue项目构建实战基础知识：SPA理解/RESTful接口介绍/static目录配置/axios封装/打包时map文件去除

    一.SPA 不是指水疗.是 single page web application 的缩写.中文翻译为 单页应用程序 或 单页Web应用,更多解释请自行搜索. 所有的前端人员都应该明白我们的页面的 u ...

  5. 理解Hybrid接口的应用

    Hybrid接口既可以连接普通终端的接入链路又可以连接交换机间的干道链路,特允许多个vlan的帧通过,并可以在出接口方向将某些vlan帧的标签剥掉. 通过配置Hybrid接口,能过实现对VLAN标签的 ...

  6. （VLAN）理解Hybrid接口的应用

    实验三:理解Hybrid接口的应用 实验原理: 实验内容: 某企业二层网络使用两台S3700交换机S1和S2,且两台设备在不同的楼层.网络管理员规划了3个不同VLAN, HR部门使用VLAN 10,市 ...

  7. 理解Java接口

    作者:梅云罗链接:https://www.zhihu.com/question/20111251/answer/14760353来源:知乎著作权归作者所有,转载请联系作者获得授权. 接口只是一个规范, ...

  8. C# 我理解的接口、抽象类、以及事件

    一.摘要 面试中无数次被问及到什么是接口,什么是抽象类,接口和抽象类有什么区别?什么是委托,什么是事件. 请写出猫叫了,老鼠跑了的例子..... 这些东西对于一些初学者来说可能还真的有点搞不懂,对于一 ...

  9. [原创]java WEB学习笔记27：深入理解面向接口编程

    本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当 ...

随机推荐

  1. Filebeat使用

    1.Beat家族 Beats可以直接(或者通过Logstash)将数据发送到Elasticsearch,在那里你可以进一步处理和增强数据,然后在Kibana中将其可视化. 2.FileBeat安装 2 ...

  2. Qt控制台输出QString

    有时候想在控制台输出我们想要的QString变量. 1.qDebug可以实现在控制台终端打印,但我们还是想使用C++中的std::cout<<variable This function ...

  3. HearthBuddy DONOTDELETE.bin

    namespace Hearthbuddy{    // Token: 0x02000022 RID: 34    public class App : System.Windows.Applicat ...

  4. vuejs2项目开发实战视频教程

    0.课程大纲 一.点餐系统(移动) 1.0.课件 1.1.项目初始化_首页顶部 1.2.首页列表_底部导航 1.3.商家顶部_商家优惠信息弹层 1.4.商品主体_类别菜单 1.5.购物车操作_商品信息 ...

  5. easyUI之练习

    <%@ page language="java" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC & ...

  6. [Java复习] 集合框架 Collection

    Q1 Collection java的集合以及集合之间的继承关系? 数组和链表的区别? 固定长度,连续内存,不能扩展,随机访问快,插入删除慢.链表相反 List, Set, Map的区别? List, ...

  7. Linux shell利用sed如何批量更改文件名详解[转载]

     需求背景: 目录A用来存放自动化的包生成的apk文件,现在开发修改了包名的 命名规则:环境名称(pro|uat)-release-日期-v版本号.apk 原来的是思路是通过正则表达式匹配新的包名,但 ...

  8. python 生成词云

    1.知识点 """ WordCloud参数讲解: font_path表示用到字体的路径 width和height表示画布的宽和高 prefer_horizontal可以调 ...

  9. AcitveReocrd事件和关联操作

    ActiveRecord预定义的事件,都在 yiidbBaseActiveRecord 中进行了明确:   abstract class BaseActiveRecord extends Model ...

  10. 给php安装openssl扩展

    转自 http://blog.csdn.net/sinat_23678421/article/details/42217971