javascript - HTML + Javascript 按钮再次单击可撤消

Question

我想知道如何让按钮在单击后也撤消某些操作。在我的场景中，只是简单地格式化文本(颜色、大小等)，当您第一次单击它时，它会按照 Javascript 中的描述格式化文本，但我想添加一个函数，当您再次单击它时，它会撤消该功能.

`<script>    
function myFunction(){    
  document.getElementById("demo").style.fontsize="25px";
  document.getElementById("demo").style.color="#3AF702";
  document.getElementById("demo").style.backgroundcolor="red";    
}    
</script>`

<button type="change" onclick="myFunction()">Change!</button>

我已经检查了其他文章，这些文章似乎是相关的，但我没有从这些文章中得到任何聪明的东西，所以如果它是重复的，我提前道歉并感谢您的帮助!

Answer 1

<script>    
var flag = true;
function myFunction(){
  let el = document.getElementById("demo");
  el.style.fontsize = flag ? "25px" : "";
  el.style.color= flag ? "#3AF702" : "";
  el.style.backgroundcolor=flag ? "red" : "";   
  flag = !flag; 
}    
</script>`

<button type="change" onclick="myFunction()">Change!</button>