A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© zp675745087 初级黑马   /  2018-12-13 21:02  /  677 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

<!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.获取图片对象
    var light = 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>

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马