单击时如何添加和删除类

Question

使用animate.css时出现问题。 添加按钮类并删除动画后，如何制作？

HTML：

<div></div>
<button>Click</button>

JavaScript的

var button = document.getElementsByTagName('button')[0];
var div = document.getElementsByTagName('div')[0];

button.addEventListener('click', function() {
  div.classList.add('animated', 'bounceInDown');
});

链接到沙箱 。

Answer 1

您可以使用classList.toggle方法：

document.querySelector('.element').classList.toggle('class');

此行从元素中添加/删除类。

一种（数字）解决方案的更多详细信息：

var button = document.getElementsByTagName('button')[0];
var div = document.getElementsByTagName('div')[0];

button.addEventListener('click', function() {
  div.classList.add('animated', 'bounceInDown');
  setTimeout(deleteClass, 1000);

});

function deleteClass(){
    console.log("Test");
    div.classList.add('animated', 'bounceInDown');
    div.classList.remove('animated', 'bounceInDown');
}