Javascript文件.getElementsByClassName不返回所有元素
Javascript document.getElementsByClassName not returning all elements
我有以下javascript代码(纯js,没有lib),但是当它运行时,它只返回一个元素而不是两个
function changeButtonStyles() {
var actualButtons = document.getElementsByClassName("read-more");
for (var i = 0; i < actualButtons.length; i++) {
actualButtons[i].parentNode.className = "basic";
actualButtons[i].className = "btn btn-xs btn-default";
}
它应该从页面返回两个元素,以便我可以同时修改它们,但是它只返回一个元素,或者循环只迭代一个元素。为什么会这样?
jsfiddle
尝试通过方法选择所有元素
document.querySelectorAll(".read-more");
我更新小提琴https://jsfiddle.net/rzdkr2gL/7/
可以使用forEach
方法
actualButtons.forEach(function (el) {
el.parentNode.className = "basic";
el.className = "btn btn-xs btn-default";
})
或(推荐方式)
Array.prototype.forEach.call(actualButtons, function (el) {
el.parentNode.className = "basic";
el.className = "btn btn-xs btn-default";
})
或
NodeList.prototype.forEach.call(actualButtons, function (el) {
el.parentNode.className = "basic";
el.className = "btn btn-xs btn-default";
})
最终代码可能看起来像https://jsfiddle.net/rzdkr2gL/8/
相关文章:
- react-让一个元素返回两个相邻的<tr>标签
- Javascript可见元素返回未定义
- 如果循环中至少有一个元素返回 false,如何将变量设置为 false
- 从异步调用返回数组,然后为数组的每个元素返回其他异步调用
- jQuery mMenu如何通过单击某些元素返回到上一节
- Ajax 元素返回完整的 html 代码
- Javascript:计算每个表的表行数,并向相应的元素返回一个值
- 激活 .stop() 后,将元素返回到其起始位置
- 访问 iFrame 中的元素返回空值
- Knockout.js 从 observableArray 中提取元素返回 undefined
- 获取 0 的文档元素返回什么
- scrollTop为javascript中的所有文档元素返回0,但滚动事件在body标记上触发
- 从Ajax生成的DOM元素返回id
- 如何在交换后将列表元素返回到其原始样式
- 文本元素返回"undefined"
- 从数组中获取随机元素返回相同的元素
- 从聚合物元素返回简单值
- React:将新插入的子元素返回给父元素以更新状态
- 元素返回NaN作为宽度
- 新添加的DOM元素返回null