JS Date的使用例子。

最新推荐文章于 2022-05-08 09:30:00 发布

十年树木_2015

最新推荐文章于 2022-05-08 09:30:00 发布

阅读量539

点赞数

分类专栏： javaScript 文章标签： js 日期使用

本文链接：https://blog.csdn.net/qq_30337695/article/details/51611512

版权

javaScript 专栏收录该内容

30 篇文章 0 订阅

订阅专栏

下面是js中new Date()的使用例子，日期格式的显示；包括一些小例子。

html代码：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js Date的使用</title>

</head>
<style>
.displayDate{
    width:500px;
    height:200px;
    border:1px solid #ccc;
}
.display2{
    margin-top: 100px;
    width:500px;
    height:200px;
    border:1px solid #ccc;
}
.local{
    margin-top: 100px;
    width:500px;
    height:100px;
    border:1px solid #ccc;
}
</style>
<body οnlοad="showTime()">
<div class="displayDate">
    当前日期:<div id="date"></div>
    当前时间:<div id="time"></div>
</div>

<div class="display2">
日期：<div id="display_day"></div>
时间：<div id="display_time"></div>
      </br>
日期和时间<div id="display_day_time"></div>
</div>

<div class="local" id="local"></div>
<button οnclick="displayTime()">点击显示localStorage存贮的时间</button>

js代码：

<script type="text/javascript">
window.οnlοad=function(){
    showTime();

    document.getElementById("display_day").innerHTML = getDate();
    document.getElementById("display_time").innerHTML = getTime();

    document.getElementById("display_day_time").innerHTML = getDateTime();

    localStorage.setItem("thisTime", getDateTime());


}

var displayTime = function(){
    var local = document.getElementById("local");
    var thisTime = localStorage.getItem("thisTime");

    local.innerHTML = thisTime;
}

var showTime = function(){
    var currentDT = new Date();
    var y,m,date,day,hs,ms,ss,theDateStr,theTimeStr;

    y = currentDT.getFullYear(); //四位整数表示的年份
    m = currentDT.getMonth()+1; //月
    date = currentDT.getDate(); //日

    hs = currentDT.getHours(); //时
    ms = currentDT.getMinutes(); //分
    ss = currentDT.getSeconds(); //秒

    theDateStr = y+"年"+  m +"月"+date+"日";
    theTimeStr = hs+":"+ms+":"+ss;

    document.getElementById("date").innerHTML = theDateStr;
    document.getElementById("time").innerHTML = theTimeStr;

    window.setTimeout(showTime, 1000);
}



//获取当前日期，格式2016-01-01
function getDate(){
    var currentDT = new Date();
    var y,m,date,day,theDateStr;

    y = currentDT.getFullYear(); //四位整数表示的年份
    m = currentDT.getMonth()+1; //月
    date = currentDT.getDate(); //日

    if (m >= 0 && m <= 9) {
        m = "0" + m;
    }
    if (date >= 0 && date <= 9) {
        date = "0" + date;
    }

    theDateStr = y+"-"+  m +"-"+date;

    return theDateStr;
}

//获取当前时间,格式05:02:02
function getTime(){
    var currentDT = new Date();
    var hs,ms,ss,theTimeStr;

    hs = currentDT.getHours(); //时
    ms = currentDT.getMinutes(); //分
    ss = currentDT.getSeconds(); //秒

    if (hs >= 0 && hs <= 9) {
        hs = "0" + hs;
    }
    if (ms >= 0 && ms <= 9) {
        ms = "0" + ms;
    }
    if (ss >= 0 && ss <= 9) {
        ss = "0" + ss;
    }

    theTimeStr = hs+":"+ms+":"+ss;

    return theTimeStr;
}

//获取日期和时间，格式2016-01-01 05:02:02
function getDateTime(){
    var date = getDate();
    var time = getTime();

    var date_time = date+" "+time;

    return date_time;
}
</script>
</body>
</html>

比较简单，运行下看看。不做解释了。