javascript - 点击后检查div是否存在，如果存在则将其删除

Question

我有一个 JavaScript，它创建一种 Accordion 类型，我想在单击时打开 div ，然后在第二次单击时关闭它们。我可以做到这一点，但随后我不知道在哪里插入删除代码 el.classList.remove("openDiv"); 来关闭所有可能打开的选项卡以及唯一应该打开的选项卡open 是点击的那个。

这是 JavaScript 代码:

var el = document.getElementsByClassName('applications');
var i;
var action = 1;

function addHandler(el) {
   el.addEventListener("click", function() {

     if ( action == 1 ) {
       el.classList.add('openDiv');
       action = 2;
     } else {
       el.classList.remove("openDiv");
       action = 1;
     }
   });
}

for (i = 0; i < el.length; i++) {
   addHandler(el[i]);
}

我还创建了一个DEMO

Answer 1

var el = document.getElementsByClassName('applications');
var i;

function addHandler(el) {
  el.addEventListener("click", function() {

     //updated condition for click
     if ( !this.classList.contains('openDiv')) {
        var a = document.getElementsByClassName('openDiv');
        for (var i in a) {
          if (a[i].classList) {
            a[i].classList.remove("openDiv");
          }
        }
        el.classList.add('openDiv');
        action = 2;
    } else {
        el.classList.remove("openDiv");
        action = 1;
    }

  });
}

for (i = 0; i < el.length; i++) {
  addHandler(el[i]);
}

Working demo