使用setTimeout添加和删除类

Question

我想基于时间向div添加和删除一个类。它应该在6秒后添加一个类，并在4秒后将其删除。我尝试了一个基本的实现。为什么this没有工作？我假设问题是两个setTimeout一起像这样。如果我注释掉第二行，那么第一行就可以了。这里发生了什么？

setTimeout(addHighlight(), 6000);
setTimeout(removeHighlight(), 10000);

有人可以告诉我如何在delay参数的基础上编写一个同时执行（添加和删除类）的函数吗？

Answer 1

试试这个：

setTimeout(function() {
  $('#square').addClass('highlight');
}, 6000);

setTimeout(function() {
  $('#square').removeClass('highlight');
}, 10000);

https://jsfiddle.net/js6wh78h/8/

Answer 2

这可能是你想要做的：

＆＃13;

＆＃13;

setTimeout(function(){
  $("#test").addClass('on');
  
  setTimeout(function(){
     $("#test").removeClass('on');
  }, 4000);
}, 6000);

＆＃13;

.on {
  background: lime;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="test">hello world</div>

＆＃13;

＆＃13;

＆＃13;

第一个超时在6秒后执行，向div添加一个类并开始另一个超时，在4秒后执行并删除该类。