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. （转）Spring Boot(七)：Mybatis 多数据源最简解决方案

    http://www.ityouknow.com/springboot/2016/11/25/spring-boot-multi-mybatis.html 说起多数据源,一般都来解决那些问题呢,主从模 ...

  2. 【转】AJAX发送 PUT和DELETE请求注意事项

    jax使用restful服务发送put 和 delete 请求时直接传参会出现问题 一,采用POST  + _method:delete/put  + filter 的方法ajax发送put 和 de ...

  3. Linux：Day11(上) ifcfg命令

    将Linux主机接入到网络中: 配置方式: 静态指定: ifcfg:ifconfig,route,netstat ip:object{link,addr,route},ss,tc 配置文件:syste ...

  4. len()方法

    len() 方法返回对象(字符.列表.元组等)长度或项目个数 len()方法语法: len( 对象 )

  5. svn离线安装以及配置，管理python自动化脚本

    1.使用源码安装,自己make和install,难度还挺大的,改用对应iso中的rpm安装包来安装 2.iso中的rpm包安装,会存在rpm包之间的依赖的关系 3.这种依赖关系,可以处理,仍然在iso ...

  6. 学习使用PM2管理nodejs进程

    在项目中,偶尔对命令会忘记一下,所以在此记录下pm2的常用命令. 1. pm2是什么?pm2 是一个带有负载均衡的Node应用的进程管理器, 它能够管理Node应用,还能够对应用的运行状态进行监控. ...

  7. face detection[Face R-CNN]

    face r-cnn是腾讯ai实验室的作品,而且登录过腾讯ai实验室官网,发现果然硕果累累,不得不佩服. 1 引言 人脸检测虽然相对之前有了不小的进步,可是还是因为真实世界中人脸图像的明显变化导致仍然 ...

  8. Web组件流畅拖动效果

    拖动效果,可以形象的帮助用户处理一些问题,比如Windows删除文件,只需将文件拖动至回收站即可.比起右键显得更形象,我觉得更好玩一点^_^.当然,在其他许多方面,其实也有用到拖动效果,只是他们不是那 ...

  9. ASP.NET Core如何使用WSFederation身份认证集成ADFS

    如果要在ASP.NET Core项目中使用WSFederation身份认证,首先需要在项目中引入NuGet包: Microsoft.AspNetCore.Authentication.WsFedera ...

  10. odoo 11 配置nginx反向代理

    第一步 安装nginx 和 certbot    具体步骤可以参考这篇文章的第6,7步. 第二步 配置nginx映射到odoo网站的文件,主要有2个,文件中的cloudapp.top是我们自己的域名, ...