Javascript 循环通过div并切换类（如果存在另一个类）

如果找到另一个类，我想切换一个类（并使用间隔使文本闪烁）

CSS

HTML

---

间隔时间没有正常工作。如果发现类notify，则应将flash类添加到文本中。

您可以使用以下代码和

css3

轻松完成此操作：

$( document ).ready(function() {
    $('.text.notify').toggleClass('flash');
});

Css3：

---

在

setInterval

回调中，

此

引用

窗口

对象

要解决此问题，一个选项是在回调之外捕获对

this

的引用：

我还删除了对

notify

类的检查，因为您可以直接选择这些元素

---

或者，您也可以使用设置此的值：

---

作为补充说明，由于您同时在所有元素上切换类，因此您可以使用：

setInterval(function() {
  $('.text.notify').toggleClass('flash');
}, 1000);

---

如果要设置延迟，可以根据

的当前索引添加超时。each（）

循环：

---

最后，您可以完全避免jQuery，并使用无限CSS3动画：

.text.notify{
动画：flash 2s无限；
}
@关键帧闪烁{
0%, 49% {
颜色：#000；
}
50%, 100% {
颜色：#DC4900；
}
}

Flash
闪光
闪光
闪光
不要闪烁，而是执行以下操作：

$( document ).ready(function() {

  setInterval(function() {
    $('.text').each(function(){
      if($(this).hasClass('notify')) {
          $(this).toggleClass('flash');
      }
    });
  }, 1000);
});

$( document ).ready(function() {
    $('.text.notify').toggleClass('flash');
});

.flash {
    color: #DC4900;
    animation: flasher 1s linear 2;
}

@keyframes flasher {  
    50% { opacity: 0.0; }
}

$('.text.notify').each(function() {
  var self = this;

  setInterval(function() {
    $(self).toggleClass('flash');
  }, 1000);
});

$('.text.notify').each(function() {
  setInterval(function() {
    $(this).toggleClass('flash');
  }.bind(this), 1000);
});

setInterval(function() {
  $('.text.notify').toggleClass('flash');
}, 1000);

$('.text.notify').each(function(i) {
  var self = this;

  setTimeout(function() {
    setInterval(function() {
      $(self).toggleClass('flash');
    }, 1000);
  }, 1000 * i);
});

$( document ).ready(function() {

  setInterval(function() {
    $('.text').each(function(){
      if($(this).hasClass('notify')) {
          $(this).toggleClass('flash');
      }
    });
  }, 1000);
});