<!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. Windows10下virtualenv配置

    1.安装virtualenv pip install virtualenv 2.选定一个目录,作为存储不同环境的总目录 3.安装virtualenvwrapper-powershell(只适用于Pyt ...

  2. 为IONIC开发的安卓apk签名

    首先进入\platforms\android目录生成一个keystore文件: keytool -genkey -alias mykey -keyalg RSA -validity 40000 -ke ...

  3. 关于vb编程之字符串连接/拼接的方法与技巧

    在VB中,笔者知道的字符串的拼接方法主要有两种拼接符号,一种为"&"符,另一种则为"+"符 一.其中&连接运算符用于强制将两个表达式作为字符串连 ...

  4. 腾讯地图打开地图选取位置 withMap

    https://lbs.qq.com/tool/component-picker.html withMap import React, { Component } from "react&q ...

  5. 四、XML语言学习（2）

    XML约束之DTD 1.XML都是用户自定义标签,若出现小小的错误,软件程序将不能正确地获取文件中的内容而报错.XML技术中,可以编写一个文档来约束一个XML的书写规范,这个文档称之为约束格式良好的X ...

  6. C#winform窗体实现对sql server数据库的增删改查

    1.运行效果截图 2.输入用户名,密码进行查询 查找成功则显示 查找不成功显示用户信息不存在 3.输入用户名与密码,向数据库中添加用户信息 添加后数据库表信息 4.查看全部信息 5.根据编号信息进行查 ...

  7. 对Http协议基本原理的理解

    超文本传输协议 超文本传输协议(HTTP,HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络传输协议,所有的WWW文件都必须遵守这个标准.设计HTTP最初的目的是 ...

  8. 通过ALT+F9关键CALL追踪注册码

    1)弹出关键字对话框,记录关键字注册失败,请检查···· 2)使用PEID查壳 3)peid提示无壳 4)发送到OD 5)F9使od运行 5.1)继续输入用户 5.2)使其暂停 5.3)点击调试中的执 ...

  9. F#周报2019年第6期

    新闻 应用F#挑战活动 Visual F#:锁定VS 2019正式版本 Visual F#:VS 2019工具性能 ML.NET 0.10发布 F# eXchange 2019即将来临 Visual ...

  10. nginx笔记 安装nginx 配置 反向代理 多虚拟主机

    1,检测linux上是否 通过yum安装了nginxrpm   -qi  nginx 2.安装nginx之前的依赖包yum install gcc patch libffi-devel python- ...