js实现文字闪烁并可以控制闪烁的时间,比如闪烁一分钟就停止

JavaScript013

js实现文字闪烁并可以控制闪烁的时间,比如闪烁一分钟就停止,第1张

//设置闪烁颜色

var colors = ['white','black']

//设置闪烁间隔

var frequency = 500

//设置停止时间

var duration = 60000

var text = document.createElement('p')

text.innerHTML = '这里是测试文字'

document.body.innerHTML = ' '

document.body.appendChild(text)

//设置循环间隔

var i = 0

var timer = setInterval(function(){

    text.setAttribute('style','color:'+colors[i%colors.length])

    //避免变量过大

    if(i++>colors.length)i=0

},frequency)

//设置停止时间

setTimeout(function(){clearInterval(timer)},duration)

好吧~给你个代码示例:

<div id="ceshi">这里是闪烁的字体!</div>

<script>  

(function(){

    var text=document.getElementById("ceshi")

    function color(){

        if(text.style.color=="red"){

            text.style.color="yellow"

        }

        else{

            text.style.color="red"

        }

        setTimeout(function(){

           color() 

       },200)

    }

    color()

})()

</script>

不懂的话再问我吧~