使用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. Object.create

    var emptyObject = Object.create(null); var emptyObject = Object.create(null); var emptyObject = {}; ...

  2. valueOf()方法

    前面的话 关于类型转换,对象常见的两个方法是toString()和valueOf().实际上,这两个方法也可以应用在包装类型上.前面已经介绍过toString()方法,本文将介绍valueOf()方法 ...

  3. 8个前沿的 HTML5 & CSS3 效果【附源码下载】

    作为一个前沿的 Web 开发者,对于 HTML5 和 CSS3 技术或多或少都有掌握.前几年这些新技术刚萌芽的时候,开发者们已经使用它们来小试牛刀了,如今这些先进技术已经遍地开发,特别是在移动端大显身 ...

  4. Android Permission中英对照

    android.permission.ACCESS_CHECKIN_PROPERTIESAllows read/write access to the "properties" t ...

  5. SQL Server如何在变长列上存储索引

    这篇文章我想谈下SQL Server如何在变长列上存储索引.首先我们创建一个包含变长列的表,在上面定义主键,即在上面定义了聚集索引,然后往里面插入80000条记录: -- Create a new t ...

  6. 使用Node.JS访问Hyperledger Fabric的gRPC服务

    在即将正式发布的Hyperledger Fabric SDK 1.0中,Hyperledger Fabric通过gRPC提供服务接口以取代现有的REST API.本文介绍了如何使用Node.JS访问H ...

  7. 搭建CnetOS6.5x64最小系统及在线yum源的配置

    CentOS系统作为红帽系列的一款linux系统,因为其免费.开源,在中小企业中得到了广泛应用,生产上为了更好的利用资源,都采用最小系统安装,因为一个图形界面都会占去系统资源的30%到40%,生产上一 ...

  8. 原生js实现简洁的返回顶部组件

    本文内容相当简单,所以没有发布到博客园首页,如果你不幸看到,那只能是我这篇文章的荣幸,谢谢你的大驾光临~(本博客返回顶部的功能就使用的是这个组件) 返回顶部组件是一种极其常见的网页功能,需求简单:页面 ...

  9. CSS 居中方法集锦

    记录收集纯CSS层面实现的水平.垂直居中方法可用于块级.行内快.内联元素以及文字图片等. 水平或垂直居中 1.1 text-align 1.2 margin 1.3 line-height 1.4 p ...

  10. ASP.NET MVC文章附加有源码下载的文章

    很多一段时间以来,Insus.NET有分享很多有关ASP.NET MVC的文章,每隔一段时间,会把源码以及数据库分享供大家下载. 你可以按时间排序,文章越新,源码以及数据数据也就越新. 你可以从下面的 ...