使用JavaScript调整灯泡开关并记录

最新推荐文章于 2024-06-15 15:16:22 发布

Ceremony_feeling

最新推荐文章于 2024-06-15 15:16:22 发布

阅读量219

点赞数

分类专栏： JavaScript篇

本文链接：https://blog.youkuaiyun.com/Ceremony_feeling/article/details/102595382

版权

JavaScript篇专栏收录该内容

2 篇文章

订阅专栏

本文介绍如何利用JavaScript实现对灯泡开关的控制，并详细记录每次操作的状态。通过代码示例展示了具体实现过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

使用JavaScript调整灯泡开关并记录

代码：

<img src="close.png" id="image" width="250px" height="500px"><br/>
<input id="on" type="button" value="开关" onclick="c()"/>
<div id="real"></div>
<script type="text/javascript">

    var i = 0;
 var imgs = ["open.png","close.png"] ;
  var   getTime ="";

 function c() {
     var weaK ="";
     document.getElementById("image").src = imgs[i];
     if (i==0){
         i = 1;
         weaK ="---灯亮了！";
     }else{
         i = 0;
         weaK ="---灯灭了！";
     }
     var date = new Date();
     var year = date.getFullYear();
     var month = date.getMonth() + 1;
     var day = date.getDate();
     var hour = date.getHours();
     var min = date.getMinutes();
     var sec = date.getSeconds();
     getTime ='\n' + year + "年-" + month + "月-" + day + "日  " + hour + "时-" + min + "分-" + sec + "秒" + weaK;
     document.getElementById("real").innerHTML += getTime+'<br>';

 }
</script>

效果图:
在这里插入图片描述