时间戳

首页 > 解决方案 > 标识符“i”已被声明为问题

javascript - 标识符“i”已被声明为问题

问题描述

我尝试为显示内容做一个手风琴，我在 mi js 代码上遇到了这个问题，我确信这是一个很容易解决的问题，但我现在看不到它，我需要帮助才能看到它。

JS代码：

var acc = document.getElementsByClassName("servicon-button");
var i;


for (i = 0; i < acc.length; i++) {
  acc[i].addEventListener("click", function() {
    this.classList.toggle("active");
    var panel = this.nextElementSibling;
    if (panel.style.maxHeight) {
      panel.style.maxHeight = null;
    } else {
      panel.style.maxHeight = panel.scrollHeight + "px";
    }
  });
}

我的这个html：

<button class="servicon-button"> <img src="icons/computer.svg" alt=""> </button>
<div class="panel">

标签： javascripthtml

解决方案

尝试在i内部声明变量for loop，将变量放在 for 循环中确保变量仅在循环内部使用，这是一件好事，如果将其放在外部，它将与全局范围内的代码中的其他变量混合可能会导致重新分配或重新声明变量等问题

const acc = document.getElementsByClassName("servicon-button");

for (let i = 0; i < acc.length; i++) {
  acc[i].addEventListener("click", function() {
    this.classList.toggle("active");
    const panel = this.nextElementSibling;
    if (panel.style.maxHeight) {
      panel.style.maxHeight = null;
    } else {
      panel.style.maxHeight = panel.scrollHeight + "px";
    }
  });
}

旁注：var不是真的推荐，使用constandlet代替

推荐阅读