javascript - 如何在选择中切换所有元素的类？

我正在尝试编写一个函数，以在选择的所有元素都没有该类的情况下向其添加所有元素，反之亦然:

function toggleLinksActivity(d) {
  d3.selectAll(".link")
    .filter(l => l.target == d)
    .classed("non-active", l => !l.classed("non-active"));
}

这给出了.classed不是函数的错误。 documentation指出应在选择项上调用.classed，因此我尝试将最后一行更改为!d3.select(l).classed("non-active")，但这也不起作用(“t.getAttribute不是函数”)。哪里出了问题，正确的方法是什么？

注意:我已经使用下面的2个单独的函数解决了我的问题，但是将切换开关分为2个部分很难看。

function activateLinks(d) {
  d3.selectAll(".link")
    .filter(l => l.target == d)
    .classed("non-active", false);
}

function deactivateLinks(d) {
  d3.selectAll(".link")
    .filter(l => l.target == d)
    .classed("non-active", true);
}

最佳答案

Gerardo的answer通过使用 Element.classList 指向正确的方向，但是提出的解决方案仍然可以简化。事实证明，classList属性已经具有.toggle()方法，其工作方式如下:



因此，您的函数可以写成:

function toggleLinksActivity(d) {
  d3.selectAll(".link")
    .each(function(l) {
      if (l.target == d) {
        this.classList.toggle("non-active");
      }
    });
}