Question

我有一个div的页面，每个页面都有多个类。

<div class='publication parent20'></div>
<div class='publication parent12 parent42 parent91'></div>
<div class='publication parent20'></div>
<div class='publication parent32 parent23'></div>

我需要一个函数，它将一个类作为变量传递给它，将它们的样式设置为所有div，发布类为none，然后设置具有指定类的标记。

function swap_pub(pub){
  document.getElementById("publication").style.display = "none";
  //set style.display = "block" to all elements with class = pub

}

关于如何做到这一点的任何想法。

Answer 1

使用getElementsByClassName()^MDN

var pubs = document.getElementsByClassName('publication'); // a NodeList

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

这是使用jQuery看起来的样子：

$('.publication').show(); // concise

Answer 2

还有querySelectorAll比getElementsByClassName支持得更广泛。

function setDisplay(className, display) {
    var items = document.querySelectorAll('.' + className); 
    var i = items.length;
    while (i--) {
      items[i].style.display = display;
    }
}

使用共享类影响所有节点

2 个答案: