Date类型

最新推荐文章于 2022-05-21 20:21:18 发布

Flyyy_

最新推荐文章于 2022-05-21 20:21:18 发布

阅读量220

点赞数 1

分类专栏： web前段笔记文章标签： Date类型

本文链接：https://blog.csdn.net/weixin_39064722/article/details/73255906

版权

web前段笔记专栏收录该内容

3 篇文章 0 订阅

订阅专栏

创建一个日期对象，使用new操作符和Date构造函数：
var now=new Date();
var future=new Date(2018,11,11,24,0,0) //未来某个日期时间
在调用Date构造函数而不传递参数的情况下，新创建的对象自动获得当前日期和时间。

日期/时间组件方法：

方法
getTime()	1970年1月1日到此时此刻的ms数
getFullYear()	当前年份
getMonth()	当前月份（0表示1月，11表示12月）
getDate()	当前日期
getHours()	当前小时
getMinutes()	当前分钟
getSeconds()	当前秒数
getMilliseconds()	当前毫秒数
getDay()	星期几(0表示星期天，6表示星期六)

日期/时间方法实例：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>表</title>
        <style type="text/css">
            #box{
                 width: 600px;
                 height: 600px;
                 background: url(images/clock.jpg) no-repeat;
                 margin: 0 auto;
                 position: relative;
            }
            #h{background: url(images/hour.png) no-repeat center center;}
            #m{background: url(images/minute.png) no-repeat center center;}
            #s{background: url(images/second.png) no-repeat center center;}
            #h,#m,#s{width: 600px; height: 600px; position: absolute;}
        </style>
        <script type="text/javascript">
            window.onload=function(){
                var oh=document.getElementById("h");
                var om=document.getElementById("m");
                var os=document.getElementById("s");
                function go(){
                    var time=new Date();
                    var h=time.getHours()+time.getMinutes()/60;
                    var m=time.getMinutes()+time.getSeconds()/60;
                    var s=time.getSeconds()+time.getMilliseconds()/1000;
                    oh.style.transform="rotate("+h*30+"deg)";
                    om.style.transform="rotate("+m*6+"deg)";
                    os.style.transform="rotate("+s*6+"deg)";
                }
                go();
                setInterval(go,1000);
            }
        </script>
    </head>
    <body>
        <div id="box">
            <div id="h">    
            </div>
            <div id="m">
            </div>          
            <div id="s">    
            </div>
        </div>
    </body>
</html>

定时器setInterval()方法的使用：
倒计时：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>倒计时</title>
        <style type="text/css">
            #box{
                 width: 300px;
                 margin: 0 auto;
            }
        </style>
    </head>
    <body>
        <div id="box"></div>
        <script type="text/javascript">

                    odiv=document.getElementById("box");
            function go(){
                var now=new Date();
                var future=new Date(2017,5,12,24,0,0)
                var dis=Math.floor((future.getTime()-now.getTime())/1000);
                var d=Math.floor(dis/86400);
                var h=Math.floor(dis%86400/3600);
                var m=Math.floor(dis%86400%3600/60);
                var s=Math.floor(dis%60);
                odiv.innerHTML=d+"日"+h+":"+m+":"+s;
                //alert(odiv.innerHTML);
            }
            go();
            setInterval(go,1000);
        </script>
    </body>
</html>