1、显示当前时间：

<!doctype>

<html>

    <head>

        <meta charset='utf-8'>

        <script type='text/javascript'>

            function showtime(){

                var now_time = new date();    //创建时间对象的实例

                var hours = now_time.gethours();    //获得当前小时数

                var minutes = now_time.getminutes();    //获得当前分钟数

                var seconds = now_time.getseconds();    //获得当前秒数

                var timer = "" + ((hours > 12) ? hours - 12 : hours);

                timer += ((minutes < 10) ? ":0" : ":") + minutes;

                timer += ((seconds < 10) ? ":0" : ":") + seconds;

                timer += "  " + ((hours > 12) ? "pm" : "am");

                document.getElementById("aa").text = timer;

                settimeout('showtime()', 1000);

              }

            </script>

    </head>

    <body onload="showtime()">

        <div id="aa"></div>

    </body>

</html>

2、当鼠标经过图像时图像的震动效果：

<!doctype>

<html>

    <head>

        <meta charset='utf-8'>

        <script type='text/javascript'>

            var rector = 3, stopit = 0, a = 1;

            function init(which){

                stopit = 0;

                zhend =  which;

                zhend.style.left = 0;

                zhend.style.top = 0;

              }

            function rattleimage(which){

                if((!document.all && !document.getElementById) || stopit = 1)

                    return;

                if(a == 1){

                     zhend.style.top = parseInt(zhend.style.top) + rector;

                } else if(a == 2){

                     zhend.style.left = parseInt(zhend.style.left) + rector;

                } else if(a == 3){

                     zhend.style.top = parseInt(zhend.style.top) - rector;

                } else if(a == 4){

                     zhend.style.left = parseInt(zhend.style.left) - rector;

                }

               else {

                     zhend.style.left = parseInt(zhend.style.left) - rector;

                }

                if(a < 4)

                   a++;

                else

                    a = 1;

                settimeout('rattleimage()', 50);

          }

          function stoprattle(which){

            stopit = 1;

             which.style.left = 0;

             which.style.left = 0;

           }

        </script>

    </head>

    <body>

        <img src="test.png" class="zhendimage" onMouseover="init(this);rattleimage()" onmoouseout="stoprattle(this)"  />

    </body>

</html>

3、自由切换图像：

<!doctype>

<html>

    <head>

        <meta charset='utf-8'>

        <script type='text/javascript'>

            var img = new array(3);

            var nums = 0;

            if(document.images){

                for(i = 1; i <= 3; i ++){

                    img[i] = new image();

                    img[i].src = 'images/00' + i + '.png';

                }

            }

            function fort(){

                nums ++;

                document.images[0].src = img[nums].src;

                if(nums == 3)

                    nums = 0;

              }

            function slide(){

                setInterval('fort()', 1000);

            }

        </script>

    </head>

    <body onload="slide()">

    </body>

</html>

JavaScript简单的实例应用的更多相关文章

  1. Javascript DOM操作实例

          最近在学DOM,但是还是没有办法很好的记住API,想找些例子来练习,网上的例子将一个个DOM对象方法挨个举例,并没有集合在一起用,效果不尽人意.所以自己写一份实例,顺便巩固下学到的知识. ...

  2. Google Map JavaScript API V3 实例大全

    Google Map JavaScript API V3 实例大全 基础知识 简单的例子 地理位置 语言 位置 坐标 简单的投影 事件 简单事件 关闭事件 多次添加事件 事件属性 控制 php禁用ui ...

  3. 原生Ajax用法——一个简单的实例

    Ajax全名(Asynchronous(异步) JavaScript and XML )是可以实现局部刷新的 在讲AJax之前我们先用简单的实例说一下同步和异步这个概念 /*异步的概念(就是当领导有一 ...

  4. 纯JSP简单登录实例

    记一下,免得以后忘记了,又要去查. 文件共有四个web.xml.login.jsp.logout.jsp.welcome.jsp四个文件 测试环境:Tomcat 6.0.x 假设项目名称是LoginS ...

  5. ASP.NET MVC 4 插件化架构简单实现-实例篇

    先回顾一下上篇决定的做法: 1.定义程序集搜索目录(临时目录). 2.将要使用的各种程序集(插件)复制到该目录. 3.加载临时目录中的程序集. 4.定义模板引擎的搜索路径. 5.在模板引擎的查找页面方 ...

  6. Linux简单程序实例（GNU工具链，进程，线程，无名管道pipe，基于fd的文件操作，信号，scoket）

    一, GNU工具链简介: (1)编译代码步骤: 预处理 -> 编译 -> 汇编 -> 链接: 预处理:去掉注释,进行宏替换,头文件包含等工作: gcc -E test.c -o te ...

  7. Redis：安装、配置、操作和简单代码实例(C语言Client端)

    Redis:安装.配置.操作和简单代码实例(C语言Client端) - hj19870806的专栏 - 博客频道 - CSDN.NET Redis:安装.配置.操作和简单代码实例(C语言Client端 ...

  8. MVC 4 插件化架构简单实现实例篇

    ASP.NET MVC 4 插件化架构简单实现-实例篇   先回顾一下上篇决定的做法: 1.定义程序集搜索目录(临时目录). 2.将要使用的各种程序集(插件)复制到该目录. 3.加载临时目录中的程序集 ...

  9. 分布式搜索ElasticSearch构建集群与简单搜索实例应用

    分布式搜索ElasticSearch构建集群与简单搜索实例应用 关于ElasticSearch不介绍了,直接说应用. 分布式ElasticSearch集群构建的方法. 1.通过在程序中创建一个嵌入es ...

随机推荐

  1. More C++ Idioms

    Table of Contents Note: synonyms for each idiom are listed in parentheses. Adapter Template TODO Add ...

  2. ipset可使iptables一次性封多个ip

    ipset是什么? ipset是iptables的扩展,它允许你创建 匹配整个地址集合的规则.而不像普通的iptables链只能单IP匹配, ip集合存储在带索引的数据结构中,这种结构即时集合比较大也 ...

  3. 基于MVC4+EasyUI的Web开发框架形成之旅(7)--权限控制

    我在上一篇随笔<基于MVC4+EasyUI的Web开发框架形成之旅--框架总体界面介绍>中大概介绍了基于MVC的Web开发框架的权限控制总体思路.其中的权限控制就是分为“用户登录身份验证” ...

  4. MyBatis Generator 生成的example 如何使用 and or 简单混合查询

    简单介绍: Criteria,包含一个Cretiron的集合,每一个Criteria对象内包含的Cretiron之间是由AND连接的,是逻辑与的关系. oredCriteria,Example内有一个 ...

  5. Git-打标签

    打标签同大多数 VCS 一样,Git 也可以对某一时间点上的版本打上标签.人们在发布某个软件版本(比如 v1.0 等等)的时候,经常这么做.本节我们一起来学习如何列出所有可用的标签,如何新建标签,以及 ...

  6. Maya中输出nuke脚本的方法

    因项目需要,三维部门跟踪组动画组都需要一个能够快速输出nuke预合成工程的脚本.脚本已经写完,源码不便于放出来,写一个大致思路吧. 我首先分析了nuke工程,内部包含了哪些节点,这些节点有哪些属性需要 ...

  7. 大规模问题的分解法-D-W分解法

    大规模线性规划问题的求解极具挑战性,在效率.存储和数值稳定性等方面对算法都有很高的要求.但是这类问题常常非常稀疏且有特殊结构,能够分解为若干个较小规模问题求解. 线性规划问题的目标函数和非负约束都可分 ...

  8. WebService发布到IIS

    发布WebService 第一步:选择项目右键发布 第二步:选择文件系统.目标位置(即,发布后文件保存位置) 单击发布 将WebService发布至IIS 第一步:打开IIS 右键添加网站--填写网站 ...

  9. 求1~n整数中1出现的次数(《剑指offer》面试题43)

    题意: 给定一个整数n,求1~n这n个整数中十进制表示中1出现的次数. 思路: 方法1:最直观的是,对于1~n中的每个整数,分别判断n中的1的个数,具体见<剑指offer>.这种方法的时间 ...

  10. bzoj4814: [Cqoi2017]小Q的草稿

    Description 小Q是个程序员.众所周知,程序员在写程序的时候经常需要草稿纸.小Q现在需要一张草稿纸用来画图,但是桌上 只有一张草稿纸,而且是一张被用过很多次的草稿纸.草稿纸可以看作一个二维平 ...