如何使用JavaScript更新Animate.css类

Question

我正在创建一个网站，并且希望对事件进行动画更改（例如单击按钮）。我尝试使用以下代码，但无法正常工作。我该如何解决？我有什么错吗，例如我的setAttribute()值错了吗？

function change() {
  document.getElementById("demo").setAttribute("class", "animated fadeOutDown");
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css" rel="stylesheet"/>
<p id="demo" class="animated fadeInRight delay-2s">Test</p>

<button onclick="change()">Change</button>

感谢所有帮助。

Answer 1

单击该按钮，动画效果很好。您尝试在哪个浏览器上运行它？ 某些浏览器在通过setAttribute方法设置类时遇到问题，建议的方法是使用className变量设置类，如下所示

document.getElementById("demo").className = "animated fadeOutDown";