<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport"

          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <meta name='description' content='本文来源于Apollo个人整理,仅供参考!'>

    <title>点亮灯泡</title>

    <style type="text/css">

        div{

            width: 500px;

            height: 400px;

            background-color:lightgoldenrodyellow;

        }

    </style>

</head>

<body>

    <div>

        <img id="demo" src="./pic_bulboff.gif" alt="灯泡">

    </div>

    <script>

        document.getElementById('demo').onclick = function () {

            ele = document.getElementById('demo');

            if (ele.src.match('bulbon')){

                ele.src = './pic_bulboff.gif';

            }else{

                ele.src = './pic_bulbon.gif';

            }

        }

    </script>

</body>

</html>

图片pic_bulboff.gif

图片pic_bulbon.gif

javascript实例:点亮灯泡的更多相关文章

  1. JavaScript实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...

  2. 每天一个JavaScript实例-从一个div元素删除一个段落

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  3. 每天一个JavaScript实例-推断图片是否载入完毕

    <!doctype html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  4. 每天一个JavaScript实例-动态省份选择城市

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  5. 每天一个JavaScript实例-递归实现反转数组字符串

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  6. 每天一个JavaScript实例-html5拖拽

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  7. 每天一个JavaScript实例-canvas绘图

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  8. 一些有用的javascript实例分析(三)

    原文:一些有用的javascript实例分析(三) 10 输入两个数字,比较大小 window.onload = function () { var aInput = document.getElem ...

  9. 一些有用的javascript实例分析(一)

    原文:一些有用的javascript实例分析(一) 本文以http://fgm.cc/learn/链接的实例索引为基础,可参见其实际效果.分析和整理了一些有用的javascript实例,相信对一些初学 ...

随机推荐

  1. face++实现人脸识别

    因为项目是在多年前完毕,face++的sdk可能有调整,所以部分功能可能不再适用(2017.3) 近期做了一个使用face++实现人脸识别的功能.当初看着官方文档一点头绪都没有.看了好久才弄明确.所以 ...

  2. mfs挂载

    安装客户端,客户端安装见官网 记住mfs需要dns或者修改hosts文件,实现主机名和ip对应 在mfsmaster修改mfsexports.cfg 修改挂载参数,根须需要 10.0.67.0/24  ...

  3. SpringCloud系列十三：Feign对继承、压缩、日志的支持以及构造多参数请求

    1. 回顾 上文讲解了手动创建Feign,比默认的使用更加灵活. 本文将讲解Feign对继承.压缩的支持以及日志和多参数请求的构造等. 2. Feign对继承的支持 Feign支持继承.使用继承,可将 ...

  4. VmWare下安装CentOS6

    为什么选择CentOS ? 1. 主流: 目前的Linux操作系统主要应用于生产环境,主流企业级Linux系统仍旧是RedHat或者CentOS 2. 免费: RedHat 和CentOS差别不大,C ...

  5. 代码转换工具 Java to C#

    http://www.tangiblesoftwaresolutions.com/ (Java 2 C#) http://www.tangiblesoftwaresolutions.com/Produ ...

  6. 189. Rotate Array【easy】

    189. Rotate Array[easy] Rotate an array of n elements to the right by k steps. For example, with n = ...

  7. InputArray和OutputArray

    源码路径:~/opencv-2.4.9/modules/core/include/opencv2/core/core.hpp where _InputArray is a class that can ...

  8. Nginx编译安装第三方模块http_substitutions_filter_module

    Nginx编译安装第三方模块http_substitutions_filter_module 分类:服务器技术  作者:rming  时间:-- . >>ngx_http_substitu ...

  9. 查看zookeeper是否启动

    查看进程: 方法: ps -aux | grep 'zookeeper' 系统有返回,说明zookeeper启动. 你可以搜索ps -aux.

  10. Java 扫描包下所有类（包括jar包）

    package com.MyUtils.file; [java] view plain copy import java.io.File; import java.io.FileFilter; imp ...