document.getElementsByTagName()返回的真的是数组吗?

这是这几天开发中遇到的问题。

一个如下的HTML结构:

<ul>
<li>
<li>
...
<li>
</ul>

document.getElementsByTagName()方法获取其中的<li>节点:

var li = document.getElementsByTagName("li");
var content = li.slice(0,5);

居然出现TypeError,这说明li中没有slice()方法,怎么会这样呢?

于是我查了查li的原型:

console.log(li.__proto__)
/*
Object {}
constructor:HTMLCollection()
item:item()
length:(...)
get length:()
namedItem:namedItem()
__proto__:Object
*/

果然,li确实是一个数组,然而并没有继承自Array.prototype,而是一个HTML对象实例,也就是《JS高程》里所说的NodeList,所以我们不能直接使用任何数组方法,想要使用数组方法,我们可以借助call()apply(),比如:

var content = Array.prototype.slice.apply(li,[0,5]);

用document.getElementsByTagName()返回的真的是数组吗?的更多相关文章

  1. document.getElementsByClassName返回的是一个数组

    转载自:https://www.cnblogs.com/shark1100913/p/6713327.html   document.getElementsByClassName("a&qu ...

  2. document.getElementsByTagName()方法的返回值

    在阅读<JS DOM 编程一书>一书时,看到getElementByTagName函数返回值为数组,然后自己验证了下,发现不是数组,而是一个可遍历的HTMLCollection对象 HTM ...

  3. js 原生 document.querySelectorAll document.getElementsByTagName document.querySelector document.getElementById的区别

    1.querySelector只返回匹配的第一个元素,如果没有匹配项,返回null.  2.querySelectorAll返回匹配的元素集合,如果没有匹配项,返回空的nodelist(节点数组). ...

  4. 程序猿修仙之路--数据结构之你是否真的懂数组? c#socket TCP同步网络通信 用lambda表达式树替代反射 ASP.NET MVC如何做一个简单的非法登录拦截

    程序猿修仙之路--数据结构之你是否真的懂数组?   数据结构 但凡IT江湖侠士,算法与数据结构为必修之课.早有前辈已经明确指出:程序=算法+数据结构  .要想在之后的江湖历练中通关,数据结构必不可少. ...

  5. document.getElementsByTagName

    var elems = document.forms[form_name].getElementsByTagName("INPUT"); getElementsByTagName( ...

  6. 关于querySelector 和 document.getElementsByTagName 选中集合问题

    本文解决的问题是 :运用for..of..循环时,edge浏览器报Object doesn't support property or method 'symbol.iterator'问题 以及 符号 ...

  7. 第四十三条:返回零长度的数组或者集合,而不是null

    如果一个方法的返回值类型是集合或者数组 ,如果在方法内部需要返回的集合或者数组是零长度的,也就是没有实际对象在里面, 我们也应该放回一个零长度的数组或者集合,而不是返回null.如果返回了null,客 ...

  8. 函数指针的返回值是指针数组,数组里放的是int;函数指针的返回值是指针数组,数组里放的是int指针

    函数指针的返回值是指针数组,数组里放的是int 函数指针的返回值是指针数组,数组里放的是int指针 #include <stdio.h> #include <stdlib.h> ...

  9. lastIndexOf() 找出指定元素出现的所有位置(返回的是下标数组)---lastIndexOf() 这个方法是倒叙查找,正序的是indexOf()

    var indices = []; var array = ['a', 'b', 'a', 'c', 'a', 'd']; var element = 'a'; var idx = array.las ...

随机推荐

  1. Android布局管理器(线性布局)

    线性布局有LinearLayout类来代表,Android的线性布局和Swing的Box有点相似(他们都会将容器里面的组件一个接一个的排列起来),LinearLayout中,使用android:ori ...

  2. 关于c:\fakepath\的解决办法

    (2014.11.25 最后更新) 一.碎碎念:关于访问本地图片的路径的问题,比较典型的例子就是上传头像.在以往的解决办法中,我们大多是先将图片上传到服务器然后从服务器返回图片,显示在页面上以达到预览 ...

  3. TCP/UDP基本概念部分

    最近在读<Unix网络编程>和<TCP/IP详解>两本书,有了一些自己的心得与体会,总结下其中典型的问题. 1. 为什么建立连接需要三次握手? 谢希仁的<计算机网络> ...

  4. SGU 106.Index of super-prime

    时间限制:0.25s 空间限制:4M 题目大意:                 在从下标1开始素数表里,下标为素数的素数,称为超级素数(Super-prime),给出一个n(n<=10000) ...

  5. python - StringIO文本缓冲

    参考:http://pymotwcn.readthedocs.org/en/latest/documents/StringIO.html 类StringIO提供了一个在内存中方便处理文本的类文件(读, ...

  6. 支付宝支付错误 系统忙:错误代码AE150002999

    今天出现支付宝支付错误,支付系统繁忙请稍等,错误码AE150002999.测试了其他连个收款方,可跳转到正常扫码支付页面,排除了代码错误. 在登录支付宝商家中,也签约了“即时到帐”功能.度娘和查看都找 ...

  7. sql语句复制表

    1.复制表结构及数据到新表CREATE TABLE 新表 SELECT * FROM 旧表 这种方法会将oldtable中所有的内容都拷贝过来,当然我们可以用delete from newtable; ...

  8. Day11 Memcached、Redis和RabbitMQ安装

    修改Ubuntu镜像源: sudo vi /etc/apt/sources.list 全部替换为以下内容: ---------------------------------------------- ...

  9. 关于Look and Say序列的感想

    今天无意间翻到了<PHP经典实例>中字符串章节中关于Look and Say序列的那个程序: <?php function lookandsay($s) { //将保存返回值的变量初 ...

  10. 转:mysql性能优化的19个要点

    原文来自于:http://outofmemory.cn/mysql/mysql-performance-tips 1.为查询优化你的查询 大多数的MySQL服务器都开启了查询缓存.这是提高性最有效的方 ...