【JavaScript】时间对象

基础知识:

获取年月日,时间:

var date=new Date();
        console.log(date);

Thu Nov 17 2022 10:15:07 GMT+0800 (中国标准时间)
实际上是对象,但是自动转为字符串显示了。

// 传递参数进去

var date1=new Date("2022/11/25 14:38:09");
    console.log(date1);

注:格式一定不能乱,日期可以是/或者-,时间一定是:

用get方法:

// 获取年份
console.log(date.getFullYear())
// 获取月份
console.log(date.getMonth())
// 获取日子
console.log(date.getDate())
// 小时:getHours()
// 分钟:getMinutes()
// 秒数:getSeconds()
//毫秒:getMilliseconds()
//时间戳:

 console.log(date.getTime())//这里显示的是1970年到现在的毫秒数
    console.log(new Date(1669359219166))

更改年月日,时间:
用set方法:

 date.setFullYear(2050)
        console.log(date)

Fri Nov 25 2050 15:48:16 GMT+0800 (中国标准时间)

案例:做一个定时器:

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>定时器title>
head>
<body>
    <button id="btn1">清除定时器-延时button>
    <button id="btn2">清除定时器-间隔循环button>
body>
<script>
    // 定时器属于异步执行,必须要在同步执行完后才执行,
    // 如果同步比较繁忙或者根本就是死循环,那么异步将有可能不执行
    console.log("我最早执行!");

    // 执行一次,延时执行
   var time1= setTimeout(function(){
console.log("【延时】只能执行一次");
    },1000)

    // 每隔一段时间执行一次
    var time2=setInterval(function() {
        console.log("【间隔】时间:"+new Date());
    },1000)
    console.log(time1,time2);
    // 停止定时器
//     clearTimeout(time1);
// clearInterval(time2);
console.log(btn1,btn2);
btn1.onclick = function() {
    console.log("btn1 click");
    clearTimeout(time1);

}
btn2.onclick = function() {
    console.log("btn2 click");
    clearInterval(time2);
}
console.log("我最后,但是比定时器要早出来!");
script>
html>

【JavaScript】时间对象_第1张图片

案例:倒计时:

<script>
    // 截止时间设置为固定
    var targetDate=new Date("2022/11/27")

    function diffTime(currentDate,targetDate){
        var sub=parseInt((targetDate-currentDate)/1000);
        var day=parseInt(sub/(60*60*25));
        var hours=parseInt(sub%(60*60*24)/(60*60));
        var minutes=parseInt(sub%(60*60)/60);
        var seconds=sub%60;
        console.log(hours);
        var obj={
            day:day,
            hour:hours,
            minutes:minutes,
            seconds:seconds
        }
        return obj;
    }
    
// 使用间隔定时器让时间流动
setInterval(function() {
    // 当前时间一秒钟刷新一次,以便于倒计时能实现
    var currentDate=new Date();
    var res=diffTime(currentDate,targetDate);
document.write("距离截止时间还有:"+res.day+"天"+res.hour+"小时"
+res.minutes+"分钟"+res.seconds+"秒");
document.write("
"
); },1000)
script>

第二种:

<script>
    function countDown(time) {
        // 使用时间戳去计算不会出现负值
       var nowTime= +new Date(); //返回的是当前时间总的毫秒数
        var inputTime= +new Date(time);  //返回的是用户输入时间总的毫秒数
        var times=(inputTime - nowTime)/1000;  //times是剩余时间总的秒数
        var d=parseInt(times /  60 / 60 / 24); //天
        d=d<10?'0'+d:d;
        var h=parseInt(times / 60 / 60 % 24);//小时
        h=h<10?'0'+h:h;
       var m=parseInt(times / 60 % 60); //分钟
       m=m<10?'0'+m:m;
       var s=parseInt(times % 60);//秒
       s=s<10?'0'+s:s;
       return d+'天'+h+'时'+m+'分'+s+'秒';
   }
   console.log(countDown('2022-12-28 20:38:00'))

你可能感兴趣的:(javascript,前端,开发语言)