javascript - querySelectorAll和getElementsBy *方法返回什么？

Question

getElementsByClassName（以及类似功能，例如getElementsByTagName和querySelectorAll）是否与getElementById相同，或者它们返回元素数组？

我问的原因是因为我试图使用getElementsByClassName更改所有元素的样式。见下文。

//doesn't work
document.getElementsByClassName('myElement').style.size = '100px';

//works
document.getElementById('myIdElement').style.size = '100px';

Answer 1

您的getElementById()代码可以工作，因为ID必须唯一，因此该函数始终仅返回一个元素（如果没有找到，则返回null）。

但是，getElementsByClassName()，querySelectorAll()和其他getElementsBy*方法返回类似数组的元素集合。像使用真实数组那样对其进行迭代：

var elems = document.getElementsByClassName('myElement');
for(var i = 0; i < elems.length; i++) {
    elems[i].style.size = '100px';
}

如果您希望使用更短的内容，请考虑使用jQuery：

$('.myElement').css('size', '100px');