学习到了:

setTimeout函数的灵活运用。

案例实现讲解:

1.先定义一个全局的变量,赋值为null。

2.然后使用timeout调用bang函数,以达到自动自动调用函数的功能。

3.bang函数就是判断时间是否为0,如果为0即换一张爆炸的图片。

实例代码:

<html>
<head><title>JS爆炸案例</title>
<script>
var clock = null;
function bang(){
var inp = document.getElementsByName('time')[0];
var time = parseInt(inp.value) - 1;
inp.value = time;
if (time == 0) {
document.getElementsByName('photo')[0].src = './bang.jpg';
clearTimeout(clock); }else{
setTimeout('bang()',1000);
}
} clock = setTimeout('bang()',1000);
</script>
</head>
<body>
<input type="submit" name="time" value="5"><br>
<img name="photo" src="./bomb.jpg" height="300px" width="300px" alt=""/>
</body>
</html>

  

JS自动爆炸案例的更多相关文章

  1. 【XSS】对抗蠕虫 —— 如何让按钮不被 JS 自动点击

    前言 XSS 自动点按钮有什么危害? 在社交网络里,很多操作都是通过点击按钮发起的,例如发表留言.假如留言系统有 XSS,用户中招后除了基本攻击外,还能进行传播 -- XSS 自动填入留言内容,并模拟 ...

  2. chart.js图表库案例赏析,饼图添加文字

    chart.js图表库案例赏析,饼图添加文字 Chart.js 是一个令人印象深刻的 JavaScript 图表库,建立在 HTML5 Canvas 基础上.目前,它支持6种图表类型(折线图,条形图, ...

  3. MyEclipse 中 添加 js自动完成模版

    MyEclipse 中 添加 js自动完成模版: window>preference>MyEclipse>Files and Editors>JavaScript>Edi ...

  4. js 自动类型转换

    js自动类型转换 1.==符号在判断左右两边数据是否相等时,如果数据类型一致,直接比较值即可 2.==符号左右数据类型不一致时,如果两方数据为布尔型.数值型.字符串型时,不为数字的那一方自动调用Num ...

  5. js调用ajax案例

    js调用ajax案例 测试地址:http://www.w3school.com.cn/tiy/t.asp?f=ajax_get 嵌入下面代码,点击提交,再点击请求数据.就可以看到结果了. <ht ...

  6. pageresponse.min.js自动缩放页面改写

    /* * 名称 :移动端响应式框架 * 作者 :白树 http://peunzhang.cnblogs.com * 版本 :v2.1 * 日期 :2015.10.13 * 兼容 :ios 5+.and ...

  7. cookie.js插件的案例

    cookie.js插件的案例: https://github.com/jaywcjlove/cookie.js/blob/master/README.md    文档  api   在这里即可查看用法 ...

  8. WebView JS交互 JSBridge 案例 原理 MD

    Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...

  9. js自动访问数据库

    js自动访问数据库 maven依赖 <dependencies> <dependency> <groupId>junit</groupId> <a ...

随机推荐

  1. 线代: N阶行列式

    线性变换 将 (x, y) 变成 (2 x + y, x - 3 y) 就叫做线性变换, 这就是矩阵乘法, 用于表示一切线性变换. 几何上看, 把平面上的每个点 (x, y) 都变到 (2 x + y ...

  2. 转:完成端口(Completion Port)详解

    手把手叫你玩转网络编程系列之三    完成端口(Completion Port)详解                                                           ...

  3. 速度挑战 - 2小时完成HTML5拼图小游戏

    概述 我用lufylegend.js开发了第一个HTML5小游戏——拼图游戏,还写了篇博文来炫耀一下:HTML5小游戏<智力大拼图>发布,挑战你的思维风暴. 详细 代码下载:http:// ...

  4. HDUOJ --2566

    统计硬币 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submis ...

  5. HDUOJ---1213How Many Tables

    How Many Tables Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) ...

  6. Ueditor编辑旧文章,从数据库中取出要修改的内容

    Ueditor编辑旧文章,从数据库中取出要修改的内容然后放置到编辑器中: <script type="text/plain" id="editor"> ...

  7. WordPress网站搬家经验总结

    http://cnzhx.net/blog/move-wordpress-site-step-by-step/也许很多人都有跟我类似的经历:因为某种原因需要将自己的WordPress站点从一个空间转移 ...

  8. oc 异常处理

    #import <UIKit/UIKit.h> #import "AppDelegate.h" int main(int argc, char * argv[]) { ...

  9. sql 2008批量删除数据表格

    DECLARE @Table NVARCHAR(300) DECLARE @Count Int = 0 DECLARE tmpCur CURSOR FOR SELECT name FROM sys.o ...

  10. SVN配置钩子

    安装测试环境:109  CentOS4.6 安装: SVN1.32http://subversion.tigris.org/downloads/subversion-1.3.2.tar.gz安装:解压 ...