2021-03-05

最新推荐文章于 2022-02-22 15:35:55 发布

Icacus

最新推荐文章于 2022-02-22 15:35:55 发布

阅读量55

点赞数

本文链接：https://blog.csdn.net/Icacus/article/details/114385772

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>电灯开关</title>
</head>
<body>

<img id="light" src="img/off.gif">

<script>
    /*
        分析：
            1. 获取图片对象
            2. 绑定单击事件
            3. 每次点击切换图片
                * 规则：
                    如果灯是开的 on，切换图片为 off
                    如果灯是关的 off，切换图片为 on
                * 使用标记flag来完成


     */
    //1.获取图片对象
    document.getElementById('light');

    var flag = false;//代表灯是灭的.  off图片

    //2.绑定单击事件
    light.onclick = function () {
        if(flag){//判断如果灯是开的，则灭掉
            light.src = "img/off.gif";
            flag = false;
        }else{//如果灯是关的，则打开
            light.src = "img/on.gif";
            flag = true;
        }
    }
</script>
</body>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Icacus

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
2021-03-05

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>电灯开关</title></head><body><img id="light" src="img/off.gif"><script> /* 分析： 1. 获取图片对象 .
复制链接

扫一扫