如何通过querySelectorAll修改for循环的最后一个值？答案

【问题标题】：How to modify the last value of a for loop via querySelectorAll?如何通过querySelectorAll修改for循环的最后一个值？
【发布时间】：2021-08-11 19:28:19
【问题描述】：

在我的以下设置中，我可以通过 classList（如下所示）修改它们的类值来轻松管理我的所有 .faq-content 项目。但是，如果我“也”想通过添加“附加”类来修改最后一个“.faq-content”项目怎么办？我如何进一步理解操纵我的价值观？我可以在这个 for 循环中完成所有操作吗？

    var mBundle = document.querySelectorAll('.faq-bundle .faq-content');
    for (var i = 0, len = mBundle.length; i < len; i++) {
        mBundle.[i].classList.add("max-height-zero");
        mBundle.[i].classList.add("hide-height");
    }

【问题讨论】：

你的意思是像mBundle[mBundle.length-1].classList.add('last-item') （显然不是在循环中，而是在之前或之后）？
是的。只是学习正确的方法。

标签： javascript ecmascript-5

【解决方案1】：

在循环内部，您可以检查计数器是否到达最后一项：

if (i == len - 1)
  mBundle[i].classList.add("blah");

或者

其他时间：

mBundle[mBundle.length-1].classList.add("blah");

【讨论】：

【解决方案2】：

您可以使用所有这些元素长度 - 1

const b = document.querySelectorAll(".b")

b[b.length - 1].style.background = "red"

.b{
  border: 2px solid red;
  width: 20px;
  height: 20px;
}

<div class="b"></div>
<div class="b"></div>
<div class="b"></div>
<div class="b"></div>

【讨论】：