这段js怎么不能执行，800毫秒变一次颜色呀？

JavaScript014

这段js怎么不能执行，800毫秒变一次颜色呀？,第1张

aa.style.color当第一次拿值的时候是red字符 然后变绿色 而第二次拿值的时候是RGB值 而不是十六进制的值 所以只变色第一次

解决办法 把RGB值转化十六进制

code

<script>

//十六进制颜色值的正则表达式

var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/

/*RGB颜色转换为16进制*/

String.prototype.colorHex = function(){

var that = this

if(/^(rgb|RGB)/.test(that)){

var aColor = that.replace(/(?:\(|\)|rgb|RGB)*/g,"").split(",")

var strHex = "#"

for(var i=0i<aColor.lengthi++){

var hex = Number(aColor[i]).toString(16)

if(hex === "0"){

hex += hex

}

strHex += hex

}

if(strHex.length !== 7){

strHex = that

}

return strHex

}else if(reg.test(that)){

var aNum = that.replace(/#/,"").split("")

if(aNum.length === 6){

return that

}else if(aNum.length === 3){

var numHex = "#"

for(var i=0i<aNum.lengthi+=1){

numHex += (aNum[i]+aNum[i])

}

return numHex

}

}else{

return that

}

}

function heads()

{

var aa=document.getElementById("head")

var color = aa.style.color

color = color.colorHex()

if(color=="#ff0000")

{

aa.style.color="#00ff00"

}

else if(color=="#00ff00")

{

aa.style.color="#ff00ff"

}

else if(color=="#ff00ff")

{

aa.style.color="#660000"

}

else if(color=="#660000")

{

aa.style.color="#6600ff"

}

else if(color=="#6600ff")

{

aa.style.color="#ff0000"

}

}

setInterval("heads()",800)

</script>

<div id="head" style="color:#ff0000">aaaa </div>

注意颜色值中的字母要小写 要不然不匹配了

1. jquery的$.delay()方法

设置一个延时来推迟执行队列中之后的项目。这个方法不能取代JS原生的setTimeout。

The .delay() method is best for delaying between queued jQuery effects. Because it is limited—it doesn't, for example, offer a way to cancel the delay—.delay() is not a replacement for JavaScript's native setTimeout function, which may be more appropriate for certain use cases.

例子：在.slideUp() 和 .fadeIn()之间延时800毫秒。

HTML 代码:

<div id="foo /">

jQuery 代码:

$('#foo').slideUp(300).delay(800).fadeIn(400)

2. 通过循环消耗cpu

function sleep(n) {

var start = new Date().getTime()

while(true) if(new Date().getTime()-start >n) break

}

3. 用setTimeout。

假设有三个步骤，步骤之间需要暂停一段时间；可以采用如下的方法：

function firstStep() {

//do something

setTimeout("secondStep()", 1000)

}

function secondStep() {

//do something

setTimeout("thirdStep()", 1000)

}

function thirdStep() {

//do something

}