HTMLCollection 表示 HTML 元素的集合。

下面的几种方式将返回 HTMLCollection对象：

html：

<body>

    <ul id="box">

      <li>节点一</li>

      <li>节点二</li>

      <li>节点三</li>

    </ul>

    <table border="1">

      <tr id="tr">

        <td>第一行</td>

        <td name="td">第二行</td>

        <td name="td">第三行</td>

      </tr>

    </table>

    <img src="duer.jpg" alt="img1" />

    <img src="ipone6s+.png" alt="img2" />

    <form action="">

      <input type="text" value="用户名">

    </form>

    <form action="">

      <input type="text" value="密码">

    </form>

    <a href="#">忘记密码</a>

    <a href="#">更多内容</a>

    <select id="select">

      <option value="0">北京</option>

      <option value="1">天津</option>

      <option value="2">河北</option>

    </select>

    <p>DOM探索之基础详解篇</p>

    <p>DOM探索之节点操作篇</p>

  </body>

JS:

        var scripts = document.scripts;

        var links = document.links;

        var cells = document.getElementById("tr").cells;

        var imgs = document.images;

        var forms = document.forms;

        var options = document.getElementById("select").options;

        var ps = document.getElementsByTagName("p");

        console.log(scripts);

        console.log(links);

        console.log(cells);

        console.log(imgs);

        console.log(forms);

        console.log(options);

        console.log(ps);

结果如下：

（二）类数组对象HTMLCollection的更多相关文章

  1. NodeList类数组对象: HTMLCollection , NamedNodeMap，两套API（childNodes , children）

    快捷键:leishuzuduixiang(类数组对象)  bianlijiedian(遍历节点)  jiedian(节点)  htmlcollection , namednodemap , nodel ...

  2. js中的节点遍历+类数组对象

    firstChild  第一个子元素 lastChild  最后一个子元素 childNodes[n]  =   childNodes.item(n)    第n+1个子元素 parentNode  ...

  3. JavaScript类数组对象参考

    JavaScript和DOM中有很多类数组对象,它们有以下特点 1.有length属性 2.可以使用[]通过下标访问 3.部分类数组对象使用[]访问成员时不只可以使用下标,还可以使用id或name 4 ...

  4. 简述JavaScript对象、数组对象与类数组对象

    问题引出 在上图给出的文档中,用JavaScript获取那个a标签,要用什么办法呢?相信第一反应一定是使用document.getElementsByTagName('a')[0]来获取.同样的,在使 ...

  5. 将类数组对象(array-like object)转化为数组对象(Array object)

    用法:Array.prototype.slice.call(array-like object) // 创建一个类数组对象 var alo = {0:"a", 1:"b& ...

  6. 浅谈JavaScript和DOM中的类数组对象

    JavaScript是一门弱类型语言,它的数据类型分为两大类:简单数据类型(5种:Undefined.Null.Boolean.Number.String)和复杂数据类型(1种:Object).Obj ...

  7. JS中集合对象(Array、Map、Set)及类数组对象的使用与对比

    原文地址 在使用js编程的时候,常常会用到集合对象,集合对象其实是一种泛型,在js中没有明确的规定其内元素的类型,但在强类型语言譬如Java中泛型强制要求指定类型. ES6引入了iterable类型, ...

  8. js－ 类数组对象

    JavaScript中,数组是一个特殊的对象,其property名为正整数,且其length属性会随着数组成员的增减而发生变化,同时又从Array构造函数中继承了一些用于进行数组操作的方法. 而对于一 ...

  9. 如何在JavaScript中手动创建类数组对象

    前言 关于什么是js的类数组对象这里不再赘述.可以参考这个链接,还有这里. js中类数组对象很多,概念简单的讲就是看上去像数组,又不是数组,可以使用数字下标方式访问又没有数组方法. 例: argume ...

随机推荐

  1. ECO开放平台对接文档说明

    应用集成: http://open.teewon.net:1000/static/index.html#/docs/flow/integrate统一认证集成文档: http://open.teewon ...

  2. $.each遍历实现延时

    今天做项目时需要一功能,如题..... $.each(json, function(idx, obj) { setTimeout(function () {downloadFile(obj.fileK ...

  3. hyperledger中文文档学习-1-词汇表

    参考:https://hyperledgercn.github.io/hyperledgerDocs/glossary/ Chaincode - 链码,即智能合约 链码是一个运行在账本上的软件,它可以 ...

  4. Spring Security（二十七）：Part II. Architecture and Implementation

    Once you are familiar with setting up and running some namespace-configuration based applications, y ...

  5. Spring Security（二）：一、Preface（前言）

    Spring Security is a powerful and highly customizable authentication and access-control framework. I ...

  6. pyQT4和pyQT5的主要模块介绍

    下面简单介绍一下pyQT4和pyQT5的主要模块 pyQT4 的主要模块 QtCore 模块包括了核心的非GUI功能,该模块用来对时间.文件.目录.各种数据类型.流.网址.媒体类型.线程或进程进行处理 ...

  7. Pyhton2.x 和Python3.x

    一. 异常处理和pint区别 try: ...except Exception,e: # 2.x,3.x 需要把逗号(,)变为as. print e.message # 2.x,3.需要吧print内 ...

  8. DAG也许是真正的区块链3.0

    从15年开始,区块链概念被单拎出来,这之前区块链还只是比特币技术里的一个数据结构,中本村白皮书里把block和chain连一起的时候也只是a chain of blocks .随着以太坊去中心化计算机 ...

  9. Java执行JavaScript脚本破解encodeInp()加密

    一:背景 在模拟登录某网站时遇到了用户名和密码被JS进行加密提交的问题,如图: 二:解决方法 1.我们首先需要获得该JS加密函数,一般如下: conwork.js var keyStr = " ...

  10. JWT认证原理及使用

    一.JWT原理: 参考文章:https://www.jianshu.com/p/180a870a308a 1.传统的登录方式: 浏览器输入用户名密码,服务端校验通过,根据用户信息生成一个token,将 ...