body部分
<button>开关灯</button>
script部分
<script>
// window.onload 是窗口加载事件,可以实现将代码写到元素上面
window.addEventListener('load', function () {
var btn = document.querySelector('button');
// 定义一个变量,用来判断灯的开关情况
var flag = 0;
btn.onclick = function () {
if (flag == 0) {
document.body.style.backgroundColor = 'black';
flag = 1;
} else {
document.body.style.backgroundColor = 'pink';
flag = 0;
}
}
})
</script>
- 如果script直接写到button下面的话,则采用以下代码
<script>
var btn = document.querySelector('button');
var flag = 0;
btn.onclick = function () {
if (flag == 0) {
document.body.style.backgroundColor = 'black';
flag = 1;
} else {
document.body.style.backgroundColor = 'pink';
flag = 0;
}
}
</script>