使用按鈕更改顏色文本

Question

我嘗試使用javascript更改html的文本顏色。 經過幾次嘗試，我意識到如果在CSS中更改顏色，則無法更改顏色。 所以基本上，這意味着CSS會在最后執行？ 如果我也在CSS中更改了按鈕，如何在單擊按鈕后更改文本的顏色？ 對不起，我是新來的

function changecol()
      { 
          var html=document.body;

          html.style.backgroundColor='black';
          html.style.color='white';

      }

期望我的html中的所有行都變成白色，但是只有那些我未應用CSS的行才變成白色

Answer 1

這是一種jQuery方法，將在單擊按鈕時更改顏色：

 $("#butt").on("click",function(){ $(".color").css("background-color","red"); $(".color").css("color","white"); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="color">HALLO</div> <button id="butt">Change Color</button> 

Answer 2

您可能正在處理繼承問題。 在您的情況下，您要在主體上放置樣式，並且唯一從主體繼承樣式的元素是沒有樣式的元素。 為了解決這個問題，我建議直接將樣式應用於每個元素。

嘗試這個：

function changecol(){
  document.body.style.backgroundColor='black';
  document.body.style.color='white';

  // change background color of each element 
  var elements = document.querySelectorAll('*');
  for(let i=0;i<elements.length;i++){
    elements[i].style.backgroundColor='black';
    elements[i].style.color='white';
  }
}