使用JavaScript实现5秒倒计时

<html>
    <head>
        <meta charset="utf-8">
        <title></title>

       <script language="javascript" type="text/javascript">
        var i = 4;
        function fun(){
                document.getElementById("mes").innerHTML = i;
                i--;
                if (i==0){
                    window.location.href = "http://localhost/text/tcr/login.html";
                    clearInterval(intervalid);
                }
            }
        setInterval("fun()",1000);
    </script>

    </head>
    <body onload="fun()">
<p>将在 <span id="mes">5</span> 秒钟后自动跳转！</p>

    </body>
</html>

使用JavaScript实现对html标签赋上默认值

<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script>
            function init(){
                document.getElementById("name").value="请输入你的名字";

            }

            function _focus(){
                document.getElementById("name").value="";
            }

            function _blur(){
                var value = document.getElementById("name").value;
                if(value == "" || value==null){
                    document.getElementById("name").value="请输入你的名字";
                }else{
                    document.getElementById("name").style.color="aqua";
                }
            }

        </script>

    </head>
    <body onload="init()">

        <!--
            onfocus:聚焦
            onblur:失去焦点
        -->
    <input type="text" id="name" onfocus="_focus()" onblur="_blur()"/>
    </body>
</html>

使用JavaScript实现电子时钟

<html>
    <head>
        <meta charset="utf-8">
        <title></title>

        <script>

            // 电子显示时钟

            function showTime(){
                var date = new Date();
                var canvas = document.getElementById("showcanvas");

                var hours = date.getHours();
                var min = date.getMinutes();
                var sec = date.getSeconds();

                canvas.innerHTML = "<h3>" + hours + ":" + min + ":" + sec + "</h3>";
            }

            setInterval("showTime()",1000);
        </script>
    </head>
    <body onload="showTime()">
        <div id="showcanvas"></div>
    </body>
</html>

实例之JavaScript的更多相关文章

  1. js实例分析JavaScript中的事件委托和事件绑定

    我们在学习JavaScript中,难免都会去网上查一些资料.也许偶尔就会遇到“事件委托”(也有的称我“事件代理”,这里不评论谁是谁非.以下全部称为“事件委托”),尤其是在查JavaScript的事件处 ...

  2. 【Js应用实例】javascript管理cookie

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

  3. 通过小实例谈谈javascript的间隔调用和延时调用

    用 setInterval方法可以以指定的间隔实现循环调用函数,直到clearInterval方法取消循环 用clearInterval方法取消循环时,必须将setInterval方法的调用赋值给一个 ...

  4. 从一个实例看javascript几种常用格式的转换

    要对如图一所示的左侧table的数据按照“总量”进行排序 1,在前端实现 2,数据格式为object,如图二 原创文章,转载请注明:http://www.cnblogs.com/phpgcs java ...

  5. js/ajax跨越访问-jsonp的原理和实例(javascript和jquery实现代码)

    最近做了一个项目,需要用子域名调用主域名下的一个现有的功能,于是想到了用jsonp来解决,在我们平常的项目中不乏有这种需求的朋友,于是记录下来以便以后查阅同时也希望能帮到大家,需要了解的朋友可以参考下 ...

  6. 《你不知道的JavaScript》整理（四）——原型

    一.[[Prototype]] JavaScript中的对象有一个特殊的[[Prototype]]内置属性,其实就是对于其他对象的引用. var myObject = { a: 2 }; myObje ...

  7. 深入理解JavaScript的闭包特性如何给循环中的对象添加事件

    初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数中(event handler)获取对应的索引.但每次获取的都是最后一次循环的索引.原因是初学者并未理解JavaScript ...

  8. 最新JavaScript、Ajax典藏级学习资料下载分类汇总 (2011年12月21日更新)

    其他网站开发相关资料            超强HTML和xhtml,CSS精品学习资料下载汇总                                               最新htm ...

  9. JavaScript 的面向对象

    一.JS 模块包装格式都用过哪些,CommonJS.AMD.CMD.定义一个JS 模块代码,最精简的格式是怎样. js模块化开发的起源. CommonJs原来是叫ServerJs,从名字可以看出是专攻 ...

随机推荐

  1. PackageManager使用

    参考:http://www.linuxidc.com/Linux/2012-02/53072.htm Android系统为我们提供了很多服务管理类,包括ActivityManager.PowerMan ...

  2. How do annotations work internally--转

    原文地址:http://stackoverflow.com/questions/18189980/how-do-annotations-work-internally The first main d ...

  3. Vim多行缩进技巧

    按v进入visual状态,选择多行,用>或<缩进或缩出 通常根据语言特征使用自动缩进排版:在命令状态下对当前行用== (连按=两次), 或对多行用n==(n是自然数)表示自动缩进从当前行起 ...

  4. Oracle ASM diskgroup在主机重启后启动失败

    环境:RHEL 6.4 + Oracle 11.2.0.3 + ASM单实例 1.重启主机后,+DATA diskgroup启动不成功,现象如下: [grid@JY-DB ~]$ crsctl sta ...

  5. 通过Nginx部署Django（基于ubuntu)

    Django的部署可以有很多方式,采用nginx+uwsgi的方式是其中比较常见的一种方式. 在这种方式中,我们的通常做法是,将nginx作为服务器最前端,它将接收WEB的所有请求,统一管理请求.ng ...

  6. Testing - 测试基础 - 分类

    对软件内部结构的深入程度 黑盒测试:又叫功能测试.数据驱动测试或基于需求规格说明书的功能测试. 白盒测试:又称结构测试.逻辑驱动测试或基于程序代码内部构成的测试. 灰盒测试:包含性能测试.自动化测试. ...

  7. 优秀前端开发教程：超炫的 Mobile App 3D 演示

    今天,我们想与您分享一个实验性的3D效果.它涉及到一个3D移动设备和一些移动应用程序截图.点击切换按钮时,我们将让移动设备转动并移动每个画面,使我们能看到一个分层的视图.你可能之前没见过这种应用程序演 ...

  8. C语言打印记事本内搜索字符串所在行信息

    本程序采用C语言编写,使用方法: 1.双击“甲骨文字符串查询作品.exe”运行程序; 2.运行前请确保此可执行程序目录下有1.txt文件. 3.根据提示输入一个字符串,程序将显示存在所搜索字符串的所有 ...

  9. 参与github上开源项目的大致流程和注意事项

    Foreword github是一个很火的代码托管服务网站,可能好多人都想参与一两个项目玩一玩学习一下,但由于是纯英文的网站,可能又会止步于想法上没有动手实践.接下来我就介绍一下参与github上开源 ...

  10. caffe 试运行MNIST

    转自:http://www.cnblogs.com/NanShan2016/p/5469942.html 编译完caffe后,在D:\caffe\caffe-master\caffe-master\b ...