如何利用js实现开关灯

小编给大家分享一下如何利用js实现开关灯，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！

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>

以上是“如何利用js实现开关灯”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注编程网行业资讯频道！