zoukankan      html  css  js  c++  java
  • javascript_时间自动刷新

    项目结构:

    运行效果:

    =========================================================

    代码部分:

    =========================================================

    /Clock/WebContent/index.jsp

     1 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
     2 <%
     3     String path = request.getContextPath();
     4     String basePath = request.getScheme() + "://"
     5             + request.getServerName() + ":" + request.getServerPort()
     6             + path + "/";
     7 %>
     8 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
     9 <html>
    10 <head>
    11 <base href="<%=basePath%>" />
    12 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    13 <title>Insert title here</title>
    14 </head>
    15 <body>
    16   <span id="clock"> </span>
    17 </body>
    18 <script type="text/javascript" src="<%=basePath%>js/clock/clock.js" charset="UTF-8"></script>
    19 </html>

    /Clock/WebContent/js/clock/clock.js

     1 /**
     2  * 时间显示
     3  * @date 2012-12-31
     4  * @author hongten(hongtenzone@foxmail.com)
     5  *
     6  * @returns
     7  */
     8 function Clock() {
     9     var date = new Date();
    10     this.year = date.getFullYear();
    11     this.month = date.getMonth() + 1;
    12     this.date = date.getDate();
    13     this.day = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六")[date.getDay()];
    14     this.hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
    15     this.minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
    16     this.second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
    17 
    18     // 日期:2012-12-31-17:03:18 星期一
    19     this.toString = function() {
    20         return "日期:" + this.year + "-" + this.month + "-" + this.date + "-" + this.hour + ":" + this.minute + ":" + this.second + " " + this.day;
    21     };
    22 
    23     // 2012-12-31
    24     this.toSimpleDate = function() {
    25         return this.year + "-" + this.month + "-" + this.date;
    26     };
    27 
    28     // 2012-12-31 17:04:03
    29     this.toDetailDate = function() {
    30         return this.year + "-" + this.month + "-" + this.date + " " + this.hour + ":" + this.minute + ":" + this.second;
    31     };
    32 
    33     this.display = function(ele) {
    34         var clock = new Clock();
    35         ele.innerHTML = clock.toString();
    36         window.setTimeout(function() {
    37             clock.display(ele);
    38         }, 1000);
    39     };
    40 }
    41 
    42 // <span id="clock"> </span>
    43 var clock = new Clock();
    44 clock.display(document.getElementById("clock"));

    我个人认为这个在web中很实用...所以推荐给大家啦...

     I'm Hongten

  • 相关阅读:
    Python中如何取字典中的键值
    Python中random模块的用法案例
    Python中模块import的使用案例
    Python中模块的定义及案例
    Python中from … import …语句
    Python中模块调用说明
    Python中模块、类、函数、实例调用案例
    Python中读写文件三部曲
    Python中特殊函数__str__()
    Python--网络编程-----基于UDP协议的套接字不会发生粘包
  • 原文地址:https://www.cnblogs.com/hongten/p/hongten_clock.html
Copyright © 2011-2022 走看看