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

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]);
posted @ 2016-03-13 00:36  韬神  阅读(1397)  评论(1编辑  收藏  举报