Question

我希望有一个按钮切换我网站上的样式更改，但样式不会在第二次点击时更改。这是我的HTML：

<button type="button" onclick="stychange()" name="stybut" id="stybut" value="off" >Style Change </button>

这是我的js：

function stychange(){
  if (button.value=="off"){
   button.value="on";
   document.body.style.backgroundColor="#00FF00";
  document.getElementById('ad').style.borderStyle="double";
}

  else {
   button.value="off";}

}

Answer 1

您设置了一个类，然后切换该类，这就是您切换样式的方式

document.getElementById('stybut').addEventListener('click', function() {
  this.classList.toggle('changed');
});

#stybut { background : #00FF00; border: 2px double red }
#stybut.changed { background : red; border: 2px double green }

<button type="button" name="stybut" id="stybut">Style Change</button>

如何使用带有js的按钮切换样式更改？

1 个答案: