<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js练习-变化的颜色</title>
    <style type="text/css">

#div1{
margin: 15px auto;
margin-top: 200px;
background: orange;
width: 200px;
height: 200px;
border-radius: 200px;
 }
</style>
</head>

<body>
    <div id="div1"></div>

<script>
var dd=document.getElementById('div1');
dd.onclick=houzi1;

function houzi1(){
    dd.style.background='red';
    // dd.onclick=houzi2;
    setTimeout('houzi2()',500);
}

function houzi2(){
    dd.style.background='orange';
    // dd.onclick=houzi3;
    setTimeout('houzi3()',500);
}
function houzi3() {
    dd.style.background='blue';
    // dd.onclick=houzi1;
    setTimeout('houzi2()',500);
}
</script>

</body>
</html>

html5 javascript 事件练习1的更多相关文章

  1. html5 javascript 事件练习3键盘控制练习

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  2. html5 javascript 事件练习3随机键盘

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  3. html5 javascript 事件练习2

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  4. 【移动端兼容问题研究】javascript事件机制详解（涉及移动兼容）

    前言 这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高 如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获 在下才疏学浅, ...

  5. JavaScript事件流原理解析

    一.为什么会有这一篇的文章 国庆前几天由于任务比较重,要赶在国庆前把一个进度的任务开发完成,所以也就有点赶,但是却遇到了一个比较奇怪的Bug,导致了任务比预计的延迟了几个小时,对此深表遗憾,所以利用国 ...

  6. JavaScript事件类型

    JavaScript事件类型 Web浏览器中可能发生的事件有很多类型.这里我将主要将下面几种常用的事件类型: UI事件 焦点事件 鼠标与滚轮事件 键盘与文本事件 复合事件 变动事件 HTML5事件 设 ...

  7. JavaScript事件总结

    JavaScript 事件总结   本文总结自<JavaScript高级程序设计>以及自己平时的经验,针对较新浏览器以及 DOM3 级事件标准(2016年8月),对少部分内容作了更正,增加 ...

  8. javaScript事件（六）事件类型之滚轮事件

    滚轮事件其实就是一个mousewheel事件,这个事件跟踪鼠标滚轮,类似Mac的触屏版. 一.客户区坐标位置 鼠标事件都是在浏览器视口的特定位置上发生的.这个位置信息保存在事件对象的clientX和c ...

  9. 【教程】HTML5+JavaScript编写flappy bird

         作者: 风小锐      新浪微博ID:永远de风小锐      QQ:547953539      转载请注明出处 PS:新修复了两个bug,已下载代码的同学请查看一下 大学立即要毕业了. ...

随机推荐

  1. 卷积神经网络(Convolutional Neural Network, CNN)简析

    目录 1 神经网络 2 卷积神经网络 2.1 局部感知 2.2 参数共享 2.3 多卷积核 2.4 Down-pooling 2.5 多层卷积 3 ImageNet-2010网络结构 4 DeepID ...

  2. JDK中Unsafe类详解

    Java中Unsafe类详解 在openjdk8下看Unsafe源码 浅析Java中的原子操作 Java并发编程之LockSupport http://hg.openjdk.java.net/jdk7 ...

  3. SQL Server 中，如何獲得上個月的第一天和最後一天( 帶時間戳)

    select DATEADD(MONTH, DATEDIFF(MONTH, 0, GETDATE())-1, 0) --First day of previous month select DATEA ...

  4. TCP连接的状态与关闭方式，及其对Server与Client的影响

    1. TCP连接的状态 首先介绍一下TCP连接建立与关闭过程中的状态.TCP连接过程是状态的转换,促使状态发生转换的因素包括用户调用.特定数据包以及超时等,具体状态如下所示: CLOSED:初始状态, ...

  5. Android新特性介绍，ConstraintLayout完全解析

    今天给大家带来2017年的第一篇文章,这里先祝大家新年好. 本篇文章的主题是ConstraintLayout.其实ConstraintLayout是Android Studio 2.2中主要的新增功能 ...

  6. centos 7 mysql启动失败--学会看错误日志

    一.现象 mysql客户端连接时: ERROR 2002 (HY000): Can't connect to local MySQL server through socket '/tmp/mysql ...

  7. PHP实现URL长连接转短连接方法总结

    短链接,通俗来说,就是将长的URL 网址,通过程序计算等方式,转换为简短的网址字符串. 这样的话其好处为:1.内容需要:2.用户友好:3.便于管理. 实现短网址(short URL)系统比较流行的算法 ...

  8. vue+axios如何操作数据交互

    参考: http://www.php.cn/js-tutorial-403543.html

  9. artTemplate的使用案列

    (2) https://github.com/aui/art-template/wiki/syntax:simple

  10. Tomcat启动时卡在 INFO HostConfig.deployDirectory Deploy

    今天在服务器上部署网站时 启动tomcat无错 tail -f catalina.out日志 和 catalina.sh run 方式启动时 卡在 22-Jul-2016 23:00:53.921 I ...