<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
<style>
    .bg{
        background-color:blue;
    }
</style>
</head>
<body>
    <input type="button" value="关灯" id="btn">

    <script>
function my$(id){return document.getElementById(id)};

var btn =my$("btn");
var isOpen = true;

btn.onclick = function(){

//方法一：变量判断
/*  if(isOpen){

    document.body.style.backgroundColor = "black";
    this.value = "开灯";
    isOpen = false;
}else{
    document.body.style.backgroundColor = "white";
    this.value = "关灯";
    isOpen = true;
 } */


//方法二：value判断
if(this.value === "关灯"){
    document.body.style.backgroundColor = "black";
    this.value = "开灯";
}else{
    document.body.style.backgroundColor = "white";
    this.value = "关灯";
}

};


    </script>

</body>
</html>