学习到了:

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. 腾讯云-搭建 JAVA 开发环境

    搭建 JAVA 开发环境 搭建 JAVA 开发环境 任务时间:18min ~ 20min 此实验教大家如何配置 JDK .Tomcat 和 Mysql 00.安装 JDK JDK 是开发Java程序必 ...

  2. php开发中sql语句拼接示例(插入、查询、更新)

    1.插入语句 $sql="insert into Ad(AdClassID,AdType,AdTit,AdFileName,AdUrl,AShow,Addtime) values('&quo ...

  3. Apache POI – Reading and Writing Excel file in Java

    来源于:https://www.mkyong.com/java/apache-poi-reading-and-writing-excel-file-in-java/ In this article, ...

  4. 深入PHP内核之array_multisort

    这个函数是我第一次看手册的时候,没看明白是怎么回事,所以有必要记录一下 用法 bool array_multisort ( array &$arr [, mixed $arg = SORT_A ...

  5. 【LeetCode】129. Sum Root to Leaf Numbers (2 solutions)

    Sum Root to Leaf Numbers Given a binary tree containing digits from 0-9 only, each root-to-leaf path ...

  6. C# 采用钩子捕获键盘和鼠标事件-验证是否处于无人操作状态

    原文地址:https://www.cnblogs.com/gc2013/p/4036414.html 全局抽象类定义 using System; using System.Collections.Ge ...

  7. [ASP.NET]HttpCookieCollection to CookieCollection的最简单方法

    http://www.cnblogs.com/dudu/archive/2012/12/06/httpcookiecollection-to-cookiecollection.html

  8. Android LinearLayout的android:layout_weight属性

    本文主要介绍Android LinearLayout的android:layout_weight属性意义 android:layout_weight为大小权重,相当于在页面上显示的百分比,它的计算是根 ...

  9. js完美的div拖拽实例代码

    方案一: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

  10. nginx实战四

    nginx负载均衡 Nginx通过upstream和proxy_pass实现了负载均衡.本质上也是Nginx的反向代理功能,只不过后端的server为多个. 1.简单的轮询 upstream www ...