每次单击按钮时，是否可以更改背景颜色并以纯JavaScript变回原始颜色？

Question

除非我使用jQuery，否则我似乎看不到Google上的任何结果，而且我不确定jQuery和javascript是否可以协同工作。

Answer 1

Try using data-* attribute to store color replacement, original background color of button element or initial setting; JSON.parse() , JSON.stringify() , Array.prototype.reverse() to toggle data-* attribute values that set background of input type="button" element; onclick event.

Not certain if requirement is to toggle background color, or reset to original color once ?

 <input type="button" value="button" data-colors='["blue", "buttonface"]' onclick="this.style.background = JSON.parse(this.dataset.colors)[0]; this.dataset.colors = JSON.stringify(JSON.parse(this.dataset.colors).reverse());" /> 

Answer 2

jQuery will not conflict with javascript, it is just a js library :) So you can use the selector.css() of jquery or, in standard js i think it is (element).style.background = color .

I recommend using jQuery. Here is a SIMPLE jQuery way to do it:

  $("#button").click(function(){ 
   $("#tochange").css("background-color", "colorhex");
  });

If you want to swap colors you could, for example, add a variable.

var x;
$("#button").click(function(){
if(x==0){
    $("#tochange").css("background-color", "colorhex"); 
    x= 1;
 } 
 else{other way round} 
});