javascript - 为什么 document.getElementsByClassName ("className")返回对象

标签 javascript dom

我有一些 dom 对象,它们是通过以下方式选择的:

 var elems = document.getElementsByClassName("royal") ;

还有其他对象

var collapsedElems =  document.getElementsByClassName("collapsed");

当我尝试使用数组 concat() 方法连接elems和collapsedElems时,出现了问题

 elems.concat(collapsedElems) 

但是getElementsByClassName()的返回类型实际上不是数组,而是 目的。我在 chrome 控制台上用 typeof 运算符检查了它。这对我来说似乎很奇怪,我如何才能将这两组对象结合起来。 ?

最佳答案

getElementsByClassName()返回 HTMLcollection对象类似于数组但不是真正的数组,因此您不能使用返回值调用数组方法。

一个技巧是使用 Array 的原型(prototype)方法以及 .call()/.apply()将返回的对象作为上下文传递。

var elems = document.getElementsByClassName("royal") ;
var collapsedElems =  document.getElementsByClassName("collapsed");
var earray = Array.prototype.slice.call(elems, 0);
var concatenated = earray.concat.apply(earray, collapsedElems) ;
console.log(concatenated)

演示:Fiddle

关于javascript - 为什么 document.getElementsByClassName ("className")返回对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29366639/

相关文章:

jquery - 获取两个 DOM 元素的共同父元素

javascript - 用 JavaScript 和 P5 创建游戏 - 几个基本问​​题

javascript - JS DOM 操作

javascript - 如何加载脚本内容而不执行?

javascript - if else 语句 JavaScript?

javascript - 使用本地存储来保持侧边栏的位置

javascript - 当内容来自 Ajax 调用时访问 div 内容时出现问题

javascript - 过滤掉 jQuery 结果集中父元素(任何级别)具有特定类的所有元素

javascript - 试图找出该功能不起作用的原因

javascript - ajax函数后访问对象