html element.style.color question

我正在寫一些JavaScript代碼來使一些文本閃爍，但它不會工作。html element.style.color question

 function start_blink(elementId) { 
      //var red = "#ff0000"; 
      //var white = "#000000"; 
      var element = document.getElementById(elementId); 
      element.style.color == 'red'; 
      if(document.getElementById) { 
       element.style.color = (element.style.color == 'red') ? 'white' : 'red'; 
       //document.write(element.style.color); 
       blinkIntervalID = setInterval(start_blink, 1000, elementId); 
      } 
     }

只變爲紅色，白色永遠，這意味着 element.style.color == 'red'總是返回假。
這是爲什麼？

來源

2011-08-16 Michael

第一 - 將'setInterval'改爲'setTimeout'以防止瀏覽器崩潰！ –

'element.style.color =='red''在Chrome中設置爲'red'時返回true - http://jsfiddle.net/DdqZF/ – rsplak

是否正在調用該函數？ –

看起來您正嘗試在您的if之前將元素的顏色設置爲紅色。如果是這樣的情況下，它應該是：

element.style.color = 'red';

不：

element.style.color == 'red';

編輯

是的，你的邏輯是有點過。 Here's a working Fiddle.

HTML

<div id="test">This is text</div>

var myInterval = null; 

function start_blink(elementId) { 
    var element = document.getElementById(elementId); 

    if (myInterval == null) { 
     element.style.color = 'red'; 
     myInterval = setInterval(start_blink, 1000, elementId); 
    } 
    else { 
     element.style.color = (element.style.color == 'red') ? 'white' : 'red'; 
    } 
} 

start_blink("test");

來源

2011-08-16 12:07:45

哦，我明白了。在這種情況下，它會變成白色，但它不會重複。我的setinterval函數語法是否正確？ – Michael

@邁克爾，看編輯（和工作小提琴）。 –

一開始這是錯誤的：

element.style.color == 'red'

應該是「=」而已。正如你寫的那樣，這將被評估爲平等測試，返回true或false。

此外，還要檢查什麼element.style.color實際返回，它可能不是「紅」或「白」，而是一個rgb或hex代碼，並且可依賴於瀏覽器。

第三，您使用setInterval是錯誤的。有關如何使用此功能的詳細信息，請參閱here。你大概的意思setTimeout：

setTimeout(function() { start_blink(elementId); }, 1000);

來源

2011-08-16 12:09:12

你的代碼是錯誤的在許多方面...轉變職能這個來代替：

function start_blink(elementId) { 
    //var red = "#ff0000"; 
    //var white = "#000000"; 
    var element = document.getElementById(elementId); 
    element.style.color = (element.style.color == 'red') ? 'white' : 'red'; 
    //document.write(element.style.color); 
    blinkIntervalID = window.setTimeout(function() { 
     start_blink(elementId); 
    }, 1000); 
}

，並調用它的第一次是這樣的：

window.onload = function() { 
    start_blink('MySpan'); 
};

Live test case。

來源

2011-08-16 12:13:04

正如已經指出的那樣，您需要確保在設置值時使用的是=而不是==，它用於比較值。

其次，根據瀏覽器如何解釋顏色（rgb，十六進制等），檢查顏色值將會非常不一致。

你可以做的是統計方法執行的次數並根據這個次數來決定。

下面是一個例子：http://jsfiddle.net/nUvJV/

在這裏，而不是檢查的顏色，我們簡單地檢查計數：

item.style.color = (blinkCounter % 2)? '#000' : '#f00';

來源

2011-08-16 12:14:24

我已經試過這樣的事情，它的工作：

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="ISO-8859-1"> 
<title>Style change</title> 
</head> 
<body> 
<p id ="stt" style="color: red"> HI MALLIK, I AM GONNA CHANGE MY STYLE !! </p> 
<button id="butt" onclick="fontChange()">font change</button> 
<script type="text/javascript"> 
function fontChange(){ 
    var line= document.getElementById('stt'); 
    line.style.fontSize = "30px"; 
    line.style.color = (line.style.color == "red") ? "blue" : "red"; 
} 
</script> 
</body> 
</html>

來源

2016-03-16 11:49:03 Mallik69

html element.style.color question

回答

相關問題