如何在几秒钟后连续更改css？答案

【问题标题】：how to change css after some seconds continously?如何在几秒钟后连续更改css？
【发布时间】：2016-04-10 06:06:46
【问题描述】：

我想在连续几秒钟后将笔画值从黑色变为白色。

这是我的脚本

<script>
$(document).ready(function(){
    $('svg').css({'stroke':'#000'});
})
</script>

【问题讨论】：

您将颜色更改为白色，所以一次，您为什么需要继续运行？
因为我想在其中添加发光效果，所以我尝试通过连续将白色变为黑色来尝试
我认为这个答案会对你有所帮助。他正在更改背景颜色类。但这是同一个概念。 stackoverflow.com/questions/6989584/…

标签： javascript jquery html css

【解决方案1】：

我以为你是说

$(function(){
    setInterval(function() { $('svg').toggleClass("white") },2000);
});

其实你的意思是

$(function(){
    var stroke = $('circle').attr("stroke");
    setInterval(function() { 
      stroke = stroke=="white"?"black":"white"
      $('circle').attr("stroke",stroke) 
    },2000);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<svg height="100" width="100">
  <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
  Sorry, your browser does not support inline SVG.  
</svg>

【讨论】：

等等，我给你提琴。

【解决方案2】：

Try this与css和jQuery类似的一种

$(document).ready(function() {
   setInterval(function() {
   $("circle").attr("stroke", "white");
     setTimeout(function() {
       $("circle").attr("stroke", "black");
     }, 500);
   }, 1000);
});

【讨论】：

是的，它正在工作。等等，让我让它不断变化。

【解决方案3】：

您可以使用recursive function 概念来实现您想要做的事情

在下面的代码中，您不断更改状态代码，颜色将相应更改。这里changeColorFunc函数每2秒调用一次

看看下面的JS FIDDLE

$(document).ready(function() {
  setInterval(function() {
    changeColor(1);
}, 2000);
});


var changeColor = function changeColorFunc (status) {
    if (status == 1) {
       $("circle").attr("class", "white");
      setInterval(function() {
                    changeColorFunc (0);
      }, 2000);
    }
    if (status == 0) {
       $("circle").attr("class", "black");
      setInterval(function() {
                    changeColorFunc (1);
      }, 2000);
    }
}

JS FIDDLE

【讨论】：