2017-02-24 74 views
0

我需要將HTML標記中的元素從黑色更改爲紅色,並將顏色再次變爲黑色。我有一個簡單的按鈕,它通過添加類的元素加1當我按下按鈕時,如何更改HTML標記中的顏色?

<html> 
<head> 
<body> 
    <div id="e">0</div> 
    <input type="button" onclick="foo()" value="Ok"> 

    <script> 
     var e = 0 
     function foo(){ 
      kak = document.getElementById('e').innerHTML = e += 1 
     } 
    </script> 

</body> 
</html> 
+6

'的document.getElementById( 「E」)style.color = 「紅色」;' – artemisian

回答

2

我會接近這一點,然後通過CSS扎那類顏色樣式。這是我正在談論的一個例子。

<html> 
    <head> 
    <style> 
     #input-button { background-color: black; color: white; } 
     #input-button.red { background-color: red } 
    </style> 
    </head> 
    <body> 
    <div id="e">0</div> 
    <input id="input-button" type="button" onclick="foo()" value="Ok"> 

    <script> 
     var e = 0 
     function foo(){ 
     var el = document.getElementById('e'); 
     el.innerHTML = e += 1; 

     var button = document.getElementById('input-button'); 
     button.classList.add('red'); 

     // setTimeout begins a timer, and I pass 500ms. To 
     // make this longer, increase the number below 
     setTimeout(function(){ 
      button.classList.remove('red'); 
     }, 500) 

     } 
    </script> 
    </body> 
</html> 

下面是一個例子 jsfiddle