点击用户界面时switch case未触发且Chrome控制台无报错问题求助

你的代码无语法错误因此控制台不会报错，核心问题出在逻辑设计上：switch语句的每个分支都是将按钮类名设置为和当前完全一致的值，没有做任何修改操作，因此点击后看不到任何效果。

如果需要实现点击循环切换三个图标的效果，只需调整每个分支的赋值逻辑，匹配当前类名后设置为下一个目标类名即可，参考修改后的代码如下：

HTML代码 #

<div class="wrapper">
  <i id="repeat" class="fas fa-stop-circle"></i>
</div>

JavaScript代码 #

const wrapper = document.querySelector('.wrapper')
const repeatBtn = wrapper.querySelector('#repeat')
repeatBtn.addEventListener('click', () => {
  let getClass = repeatBtn.className;

  switch(getClass){
    case "fas fa-redo":
      repeatBtn.className = "fas fa-random";
      break;
    case "fas fa-stop-circle":
      repeatBtn.className = "fas fa-redo";
      break;
    case "fas fa-random":
      repeatBtn.className = "fas fa-stop-circle";
      break;
  }
})

你可以根据自己需要的切换顺序，灵活调整每个case中赋值的类名。

内容的提问来源于stack exchange，提问作者user15415841