我想通过使用dark mode
在我的网站上启用toggle button
功能。我现在已经可以使用dark mode
了,我希望按钮关闭时显示Turn on dark mode
,然后打开时显示Turn off dark mode
。
function myFunction() {
var element = document.body;
element.classList.toggle("dark-mode");
}
body {
margin: 0;
font-family: Arial, Helvetica, sans-serif;
background-color: white;
color: black;
}
.dark-mode {
background-color: black;
color: white;
}
<button onclick="myFunction()">Turn on dark mode</button>
最佳答案
function myFunction() {
var element = document.body;
var btn = document.getElementById("modeSwitcher");
element.classList.toggle("dark-mode");
if(element.classList.contains("dark-mode"))
btn.innerHTML= "Turn off dark mode";
else
btn.innerHTML= "Turn on dark mode";
}
body {
margin: 0;
font-family: Arial, Helvetica, sans-serif;
background-color: white;
color: black;
}
.dark-mode {
background-color: black;
color: white;
}
<button onclick="myFunction()" id="modeSwitcher">Turn on dark mode</button>
关于javascript - 在javascript中更改按钮文本onclick,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/59382203/