日期对象

来源:互联网 发布:淘宝不能和客服聊天 编辑:程序博客网 时间:2024/06/06 09:19
var date = new Date();

讲义

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <meta name="Author" content=" ">    <title>Document</title>    <style type="text/css">        *{margin: 0;padding: 0;}        a{text-decoration: none;}        ul,li{list-style: none;}        body{font-size: 14px;font-family: "微软雅黑";}    </style></head><body>    <script type="text/javascript">        /*            日期对象            var date = new Date()            1970 到现在的一个毫秒数 1s = 1000毫秒         */        //var date1 = new Date();        //alert(Number(date1));// 1970 到现在的一个毫秒数 1s = 1000毫秒        //var date2 = new Date();        //alert(date2-date1);        // 月  0-11  1-12        // var date = new Date(2016,11,7,22);        // var date1 = new Date(1482331233300);        // var date2 = new Date('2017-1-27');        // alert(date);        //月1-12 日 年  GMT时间格式        // var date = Date.parse("12/7/2016");//返回的毫秒数        //alert(date);        // alert(new Date(date));        //UTC 年 月0-11 日 小时0-23   多8小时        // var date1 = Date.UTC(2016,11,7,-8,32,10);//返回的毫秒数        // //alert(date);        // alert(new Date(date1));        /*            区别            年月日必须要有的            UTC  从8点开始         */        /*            通用方法            toString()            valueOf()            toLocaleString()         */        var date = new Date(Date.parse("12/7/2016"));        dw("toString:"+date.toString());        dw("valueOf:"+date.valueOf());        dw("toLocaleString:"+date.toLocaleString());        document.write("<br />");        document.write("<br />");        var date1 = new Date(Date.UTC(2016,11,7));        dw("toString:"+date1.toString());        dw("valueOf:"+date1.valueOf());        dw("toLocaleString:"+date1.toLocaleString());        document.write("<br />");        document.write("<br />");        /*            格式化的方法            toDateString()             星期 月份 日期 年份            toTimeString()             时分秒 时区            toLocaleDateString()       本地格式 年 月 日            toLocaleTimeString()       本地格式 时 分 秒            toUTCString()              UTC格式输出 少了8小时         */        var date2 = new Date();        dw("toDateString:"+date2.toDateString());        dw("toTimeString:"+date2.toTimeString());        dw("toLocaleDateString:"+date2.toLocaleDateString());        dw("toLocaleTimeString:"+date2.toLocaleTimeString());        dw("toUTCString:"+date2.toUTCString());        document.write("<br />");        document.write("<br />");        /*            日期的方法            为了单独可以获取想要的各种时间            getTime()           返回 1970 年 1 月 1 日至今的毫秒数。            getFullYear()       年            getMonth()          月0-11            getDate()           日            getDay()            星期几            getHours()          小时0-23            getMinutes()        分钟            getSeconds()        秒钟            getMillSeconds()    毫秒         */        var week =['日','一','二','三','四','五','六'];        dw("当前时间:"+date2.getFullYear()+"/"+(date2.getMonth()+1)+"/"+date2.getDate()+"星期"+week[date2.getDay()]+","+date2.getHours()+":"+date2.getMinutes()+":"+date2.getSeconds());        function dw(w){            return document.write(w+"<hr />");        }    </script></body></html>

倒计时例子

<!DOCTYPE html><html lang="en">    <head>        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">        <meta name="Author" content="">        <meta name="Keywords" content="">        <meta name="Description" content="">        <title>Document</title>        <style type="text/css">            * { margin: 0; padding: 0;}            a {text-decoration: none;}            ul,li { list-style: none;}            body { font-family: "Microsoft yahei";}            h1 {text-align: center; margin: 50px;}        </style>    </head><body>    <h1></h1><script type="text/javascript">/*    2018-7-1  ----2017-3-20    获取之间的毫秒数   ---1970 */    function start(y,m,d){        var text = document.querySelector("h1");        var now = new Date();        // 注意月份要-1,  0-11        var end = new Date(y,m-1,d);        var Millseconds = end.getTime() - now.getTime();//获取之间的毫秒数        // console.log(Millseconds);        var sec = Math.abs(Millseconds/1000); //转化为秒. 较好换算        // 换算为天数, 小数,向下取整        var day = Math.floor(sec/60/60/24);        var hours = Math.floor(sec/60/60%24); //获得天数的余数,小时        var Minutes = Math.floor(sec/60%60); //获得小时的余数,分钟        var seconds = Math.floor(sec%60);   //获得分钟的余数,秒数        // console.log(seconds);        function toTime(n){            return n<10?"0"+n:n;        }        var temp = undefined;        if(Millseconds>0){            temp = "现在至"+y+"-"+m+"-"+d+",还有"+day+"天"+toTime(hours)+"时"+toTime(Minutes)+"分"+toTime(seconds)+"秒";        }else{            temp = "现在至"+y+"-"+m+"-"+d+",已过去"+day+"天"+toTime(hours)+"时"+toTime(Minutes)+"分"+toTime(seconds)+"秒";        }        text.innerHTML = temp;    }    start(2017,7,1);    setInterval(function(){        start(2017,7,1);    },1000);</script></body></html>

世界时间例子.

<!DOCTYPE html><html lang="en">    <head>        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">        <meta name="Author" content="">        <meta name="Keywords" content="">        <meta name="Description" content="">        <title>Document</title>        <style type="text/css">            * { margin: 0; padding: 0;}            a {text-decoration: none;}            ul,li { list-style: none;}            body { font-family: "Microsoft yahei";padding: 50px}            div{height: 90px;}        </style>    </head><body>    <div>        <span>北京时间:</span>        <h1 id="time1">2016-12-8 星期4,0:0:0</h1>    </div>    <div>        <span>伦敦时间:</span>        <h1 id="time2">123123</h1>    </div>    <div>        <span>东京时间:</span>        <h1 id="time3">123123</h1>    </div>    <div>        <span>悉尼时间:</span>        <h1 id="time4">123123</h1>    </div>    <div>        <span>纽约时间:</span>        <h1 id="time5"></h1>    </div><script type="text/javascript">    /*        全球时间        北京: 8        东京: 9        伦敦: 0        悉尼: 10        纽约: -5        getTimezoneOffset() 返回一个 所在时区和格林尼治时间的一个差值 (分钟)     */     // var date = new Date();    // 格林尼治时间     // var utcTime = new Date(date.getTime()+date.getTimezoneOffset()*60*1000);     // console.log(date,utcTime);     //需要拿到 时区不同返回的时间     //num 时区     function getLocationTime(num){ //时区        var date = new Date();        // 格林尼治时间--毫秒数        var utcTime = date.getTime()+date.getTimezoneOffset()*60*1000;        return new Date(utcTime+num*60*60*1000);     };     function toTime(n){        return n<10?"0"+n:n;     }     function start(num,callBack){        var date = getLocationTime(num);        var year = date.getFullYear();        var month = date.getMonth();        var day = date.getDate();        var hours = date.getHours();        var minutes = date.getMinutes();        var seconds = date.getSeconds();        var weekArr = ["日","一","二","三","四","五","六"];        var week = weekArr[date.getDay()];        var html = year+"年"+(month+1)+"月"+day+"日--星期"+week+","+toTime(hours)+":"+toTime(minutes)+":"+toTime(seconds);        // console.log(html);        //        var json = {            html:html        };         //增强灵活性        callBack&&callBack.call(json);//this指向json     }     (function init(){        start(8,function(){            //alert(this);            document.querySelector("#time1").innerHTML = this.html;         });        start(0,function(){            //alert(this);            document.querySelector("#time2").innerHTML = this.html;         });        start(9,function(){            //alert(this);            document.querySelector("#time3").innerHTML = this.html;         });        start(10,function(){            //alert(this);            document.querySelector("#time4").innerHTML = this.html;         });        start(-5,function(){            //alert(this);            document.querySelector("#time5").innerHTML = this.html;         });     })();     setInterval(function(){        start(8,function(){            //alert(this);            document.querySelector("#time1").innerHTML = this.html;         });        start(0,function(){            //alert(this);            document.querySelector("#time2").innerHTML = this.html;         });        start(9,function(){            //alert(this);            document.querySelector("#time3").innerHTML = this.html;         });        start(10,function(){            //alert(this);            document.querySelector("#time4").innerHTML = this.html;         });        start(-5,function(){            //alert(this);            document.querySelector("#time5").innerHTML = this.html;         });     },1000);</script></body></html>

以上封装成插件

HTML

<!DOCTYPE html><html lang="en">    <head>        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">        <meta name="Author" content="">        <meta name="Keywords" content="">        <meta name="Description" content="">        <title>Document</title>        <style type="text/css">            * { margin: 0; padding: 0;}            a {text-decoration: none;}            ul,li { list-style: none;}            body { font-family: "Microsoft yahei";padding: 50px}            div{height: 90px;}        </style>    </head><body>    <div>        <span>北京时间:</span>        <h1 id="time1">2016-12-8 星期4,0:0:0</h1>    </div>    <div>        <span>伦敦时间:</span>        <h1 id="time2">123123</h1>    </div>    <div>        <span>东京时间:</span>        <h1 id="time3">123123</h1>    </div>    <div>        <span>悉尼时间:</span>        <h1 id="time4">123123</h1>    </div>    <div>        <span>纽约时间:</span>        <h1 id="time5"></h1>    </div><script type="text/javascript" src="wordTime.js"></script><script type="text/javascript">    wordTime.init(8,function(){        document.querySelector("#time1").innerHTML = this.html;    });    wordTime.init(0,function(){        document.querySelector("#time2").innerHTML = this.html;    })    wordTime.init(9,function(){        document.querySelector("#time3").innerHTML = this.html;    })    wordTime.init(10,function(){        document.querySelector("#time4").innerHTML = this.html;    })    wordTime.init(-5,function(){        document.querySelector("#time5").innerHTML = this.html;    })</script></body></html>

js

var wordTime = {    /*       全球时间        北京: 8        东京: 9        伦敦: 0        悉尼: 10        纽约: -5     */    //date:new Date(),//错误的==>时间定死了    init:function(num,callBack){        this.start(num,callBack);        //$this = this; //作用域this改变.==>1.在外面保留this. 2.bind(this)        setInterval(function(){            this.start(num,callBack);        }.bind(this),1000);    },    start:function(num,callBack){        var date = this.getLocationTime(num);        var year = date.getFullYear();        var month = date.getMonth();        var day = date.getDate();        var hours = date.getHours();        var minutes = date.getMinutes();        var seconds = date.getSeconds();        var weekArr = ["日","一","二","三","四","五","六"];        var week = weekArr[date.getDay()];        var html = year+"年"+(month+1)+"月"+day+"日--星期"+week+","+this.toTime(hours)+":"+this.toTime(minutes)+":"+this.toTime(seconds);        // console.log(html);        //        var json = {            html:html        };         //增强灵活性        callBack&&callBack.call(json);//this指向json    },    getLocationTime:function(num){        var date = new Date();//        // 格林尼治时间--毫秒数        var utcTime = date.getTime()+date.getTimezoneOffset()*60*1000;        return new Date(utcTime+num*60*60*1000);    },    toTime:function(n){        return n<10?"0"+n:n;    }}
0 0