大佬教程收集整理的这篇文章主要介绍了为什么我的 querySelectorAll 列表长度未定义?,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我需要在 wordpress 博客模板中使用 Js 动态添加一个类。我设法选择了所有相关的类,但我得到“未定义”。
我选择了前 8 篇博文中出现的所有“.layout-simple”类。我的目标是按顺序在 layout-simple 类旁边添加一个独特的类,如下所示:
@H_673_7@<div class="col-lg-4 layout-simple 1"></div> <div class="col-lg-4 layout-simple 2"></div> <div class="col-lg-4 layout-simple 3"></div> <div class="col-lg-4 layout-simple 4"></div>
这是我目前使用的,将“indexes.length”记录到循环外的控制台输出正确的值。但是,循环内部不是这种情况,我得到未定义:
@H_673_7@const indexes = document.querySELEctorAll(".layout-simple"); console.log(indexes.length); // 8 indexes.forEach(function(indexes) { indexes.classList.add(indexes.length); console.log(indexes.length); // undefined });
我已经让这段代码运行起来了,它不是很漂亮,但我做了几件事:
@H_673_7@window.addEventListener('load',function(event) { const indexes = document.querySELEctorAll(".layout-simple"); console.log(indexes.length); // 8 var x = 1; indexes.forEach(e => { e.classList.add('grid' + x++); }) });
@H_673_7@.layout-simple.grid1 { color: red; } .layout-simple.grid2 { color: blue; } .layout-simple.grid3 { color: green; } .layout-simple.grid4 { color: orange; } .layout-simple.grid5 { color: red; } .layout-simple.grid6 { color: blue; } .layout-simple.grid7 { color: green; } .layout-simple.grid8 { color: orange; }
@H_673_7@<div class="col-lg-4 layout-simple">thing</div> <div class="col-lg-4 layout-simple">thing</div> <div class="col-lg-4 layout-simple">thing</div> <div class="col-lg-4 layout-simple">thing</div> <div class="col-lg-4 layout-simple">thing</div> <div class="col-lg-4 layout-simple">thing</div> <div class="col-lg-4 layout-simple">thing</div> <div class="col-lg-4 layout-simple">thing</div>
以上是大佬教程为你收集整理的为什么我的 querySelectorAll 列表长度未定义?全部内容,希望文章能够帮你解决为什么我的 querySelectorAll 列表长度未定义?所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。