首页 > 解决方案 > 添加旋转类后 span 不旋转

问题描述

在我调用dates[j].classList.toggle("rotateNumber")My的嵌套翻转函数中,console.log(dates[j])正在记录节点并显示已添加类,但是当我查看 DOM 树时,它没有显示class="number"属性内的类。我已经玩了一个小时了,但无法弄清楚。我有一个codepen,问题出在第105行。

let dates = document.querySelectorAll(".number");
        // ui module
        let rotate = 0
        document.getElementById("right-arrow").addEventListener("click", (e) => {

          rotate -= 90;
          // Reset the calendar cells
          (function filp(i) {
            setTimeout(() => {
              dateNodes[i].style.transform = "rotateY("+rotate+"deg)"
              dateNodes[i].removeChild(dateNodes[i].firstChild)
              if (i !==  41) {i++;filp(i)} else {
                rotate -= 90
                monthOffset--
                if (monthOffset === 11) { yearOffset--; console.log("true"); console.log(yearOffset)}
                fillCalendar(yearOffset,monthOffset);
                console.log(dates);

                (function filp(j) {
                  setTimeout(() => {
                    dates[j].classList.toggle("rotateNumber")
                    console.log(dates[j])
                    dateNodes[j].style.transform = "rotateY("+rotate+"deg)"
                    if (j !== 41) {j++;filp(j)}
                  }, 5)
                })(0);
              }
            }, 5)
          })(0);

标签: javascriptreactjstoggle

解决方案


推荐阅读