Javascript 未捕获的语法错误：标识符'；按钮'；已经申报了

你好，我的网站有一个小错误。我想使用github主持网站，因此我在HTML中链接了我的脚本，如下所示：

    <script src="assets/scripts/switch-content.js"></script>
    <script src="assets/scripts/loader.js"></script>
    <script src="assets/scripts/scroll-fade.js"></script>
    <script src="assets/scripts/scroll-top-load.js"></script>
    <script src="assets/scripts/shrinking-header.js"></script>
    <script src="assets/scripts/smooth scroll.js"></script>
    <script src="assets/scripts/burger-menu.js"></script>
    <script src="assets/scripts/card-flip.js"></script>

---

按钮

变量很可能在这些加载的脚本中的某个位置声明

    <script src="assets/scripts/loader.js"></script>
    <script src="assets/scripts/scroll-fade.js"></script>
    <script src="assets/scripts/scroll-top-load.js"></script>
    <script src="assets/scripts/shrinking-header.js"></script>
    <script src="assets/scripts/smooth scroll.js"></script>
    <script src="assets/scripts/switch-content.js"></script>

---

如果看不到其他脚本的内容，我们无法为您确定问题所在

只需在脚本的某个地方声明另一个名为Buttons的JS变量即可

您可以重命名这个实例，但正如注释中指出的，这是使用全局变量的副作用。更好的方法是使用一种模式来避免污染全球范围

听起来很复杂，但其实很简单：

  <script>
    (function () {
          // grab all the buttons
    let Buttons = document.querySelectorAll(".selectSection button");
    
    // loop through the buttons using for..of 
    for (let button of Buttons) {
      // listen for a click event 
      button.addEventListener('click', (e) => {
        // et = event target
        const et = e.target;
        // slect activenav class
        const activenav = document.querySelector(".activenav");
        // check for the button that has activenav class and remove it
        if (activenav) {
          activenav.classList.remove("activenav");
        }
        // add activenav class to the clicked element 
        et.classList.add("activenav");
    
        // select all classes with the name content
        let allContent = document.querySelectorAll('.contentsec');
    
        // loop through all content classes
        for (let contentsec of allContent) {
          // display the content if the class has the same data-attribute as the button 
          if (contentsec.getAttribute('data-number') === button.getAttribute('data-number')) {
            contentsec.style.display = "block";
          }
          // if it's not equal then hide it.
          else {
            contentsec.style.display = "none";
          }
        }
        this.fade(true); //Call fade method on click 
      });
    }
    })();
</script>

（功能（）{
//抓住所有的按钮
let Buttons=document.queryselectoral（“.selectSection按钮”）；
//循环浏览用于…的按钮
用于（让按钮中的按钮）{
//侦听单击事件
按钮。addEventListener（'单击'，（e）=>{
//et=事件目标
常数et=e.目标；
//slect主动导航类
const activenav=document.querySelector（“.activenav”）；
//检查具有activenav类的按钮并将其删除
如果（活动导航）{
activenav.classList.remove（“activenav”）；
}
//将activenav类添加到单击的元素
et.classList.add（“activenav”）；
//选择名称为content的所有类
让allContent=document.queryselectoral（'.contentsec'）；
//循环浏览所有内容类
for（让contentsec代表所有内容）{
//如果类与按钮具有相同的数据属性，则显示内容
if（contentsec.getAttribute（'data-number'）==button.getAttribute（'data-number'））{
contentsec.style.display=“块”；
}
//如果不相等，则隐藏它。
否则{
contentsec.style.display=“无”；
}
}
this.fade（true）；//单击调用fade方法
});
}
})();

这是全局变量的乐趣之一，只是不要使用全局变量。那么从哪里开始解决这个问题呢？我对此有点陌生：）错误消息会告诉您变量之前声明的位置，或者只是在这个脚本中重命名变量。好的，谢谢！我改变了“按钮”的变量，页面上没有实际的错误，但仍然不起作用。谢谢你的建议，但不幸的是，这没有起作用。我使用的脚本在我的JSFIDLE中工作得非常好，但是当上传到github时它停止工作。我编辑了代码并添加了所有不工作的脚本。如果控制台中没有错误，那么代码中可能有逻辑错误。你可以调试它

let burger = document.getElementById('burger'),
     nav    = document.getElementById('main-nav'),
     slowmo = document.getElementById('slowmo');
   
burger.addEventListener('click', function(e){
    this.classList.toggle('is-open');
    nav.classList.toggle('is-open');
});

$(".main-nav").click(function(){
  burger.click();
})

    <script src="assets/scripts/loader.js"></script>
    <script src="assets/scripts/scroll-fade.js"></script>
    <script src="assets/scripts/scroll-top-load.js"></script>
    <script src="assets/scripts/shrinking-header.js"></script>
    <script src="assets/scripts/smooth scroll.js"></script>
    <script src="assets/scripts/switch-content.js"></script>

  <script>
    (function () {
          // grab all the buttons
    let Buttons = document.querySelectorAll(".selectSection button");
    
    // loop through the buttons using for..of 
    for (let button of Buttons) {
      // listen for a click event 
      button.addEventListener('click', (e) => {
        // et = event target
        const et = e.target;
        // slect activenav class
        const activenav = document.querySelector(".activenav");
        // check for the button that has activenav class and remove it
        if (activenav) {
          activenav.classList.remove("activenav");
        }
        // add activenav class to the clicked element 
        et.classList.add("activenav");
    
        // select all classes with the name content
        let allContent = document.querySelectorAll('.contentsec');
    
        // loop through all content classes
        for (let contentsec of allContent) {
          // display the content if the class has the same data-attribute as the button 
          if (contentsec.getAttribute('data-number') === button.getAttribute('data-number')) {
            contentsec.style.display = "block";
          }
          // if it's not equal then hide it.
          else {
            contentsec.style.display = "none";
          }
        }
        this.fade(true); //Call fade method on click 
      });
    }
    })();
</script>