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. python 那些我记不清的函数

    eval 函数:用来计算在字符串中的有效Python表达式,并返回一个对象......将字符串变回数据类型 enumerate函数:加上序号 isinstance函数:判断数据类型 isinstanc ...

  2. CentOS7.4 ISCSI

    试验机配置: cat /etc/centos-release CentOS Linux release 7.4.1708 (Core) uname -r 3.10.0-693.el7.x86_64 所 ...

  3. IDE安装Lombok插件提高开发效率

    Lombok官方api:https://projectlombok.org/features/index.html 使用lombok之后,省去了许多没必要的get,set,toString,equal ...

  4. vue引入css的两种方式

    方案1.在main.js中引入方式    import '@/assets/css/reset.css' 方案2.在.vue文件的<style/>标签里面引入    @import &qu ...

  5. Spark性能优化指南——基础篇（转载）

    前言 在大数据计算领域,Spark已经成为了越来越流行.越来越受欢迎的计算平台之一.Spark的功能涵盖了大数据领域的离线批处理.SQL类处理.流式/实时计算.机器学习.图计算等各种不同类型的计算操作 ...

  6. MangoDB高级应用

    MongoDB高级应用 Author:SimpleWu 聚合 聚合(aggregate)主要用于处理数据(诸如统计平均值,求和等),并返回计算后的数据结果.有点类似sql语句中的 count(*). ...

  7. python第三章：循环语句--小白博客

    Python条件语句 Python条件语句是通过一条或多条语句的执行结果(True或者False)来决定执行的代码块. 可以通过下图来简单了解条件语句的执行过程: Python程序语言指定任何非0和非 ...

  8. Factors of Factorial AtCoder - 2286 （N的阶乘的因子个数）（数论）

    Problem Statement You are given an integer N. Find the number of the positive divisors of N!, modulo ...

  9. AndroidManifest.xml文件解析

    一.关于AndroidManifest.xml AndroidManifest.xml 是每个android程序中必须的文件.它位于整个项目的根目录,描述了package中暴露的组件(activiti ...

  10. 关于iframe页面里的重定向问题

    最近公司做的一个功能,使用了iframe,父页面内嵌子页面,里面的坑还挺多的,上次其实就遇到过,只不过今天在此描述一下. 请允许我画个草图: 外层大圈是父级页面,里层是子级页面,我们是在父级引用子级页 ...