是否可以在不循环元素的情况下重置整个类

Question

我有一个 12 个月的日历。当用户点击月份时，我正在调用我的函数 toggleZoom $monthNode.onclick = function(){toggleZoom(this)};

目前我正在使用这个 JS 控制缩放：

function toggleZoom(month) {

var zoomed = window.getComputedStyle(month).zIndex;
var m = document.getElementsByClassName("month");

for(var i = 0; i < m.length; i++)
    {
     m[i].style ='' ;
    }

if (zoomed != 2) {
    month.style = 'transform:scale(1.1,1.1); z-index:2';
    }
}

有没有更简洁的方法（可能是一行代码）将我所有的月份类重置为未缩放而不循环遍历所有 12 个？像 document.getElementsByClassName("month").style=""

Answer 1

您可以使用map() 函数在一行中循环遍历您的数组，而无需创建for 循环，如下所示：m.map(function(mo){ mo.style = ''; });

function toggleZoom(month) {

  var zoomed = window.getComputedStyle(month).zIndex;
  var m = document.getElementsByClassName("month");

  m.map(function(mo){ mo.style = ''; });

  if (zoomed != 2) {
    month.style = 'transform:scale(1.1,1.1); z-index:2';
  }
}

或者，使用ES6's arrow function：

function toggleZoom(month) {

  var zoomed = window.getComputedStyle(month).zIndex;
  var m = document.getElementsByClassName("month");

  m.map(mo => mo.style = '');

  if (zoomed != 2) {
    month.style = 'transform:scale(1.1,1.1); z-index:2';
  }
}