Date对象

获取时间

Date用来处理日期和时间的

// 获取当前的时间
var now = new Date();
console.log(now)//Fri Aug 02 2019 14:20:09 GMT+0800 (伊尔库茨克标准时间)
console.log(typeof now)//对象

创建一个时间 new Date(指定时间)

  • 传入一个毫秒数（会把毫秒数转换成一个时间c 然后加上1970年1月1日 8：00 的时间）
  • 传入一个字符串格式的时间 2028-10-2 101029
  • 传入多个参数 分别代表年 月 日 时 分 秒 毫秒
var date1 = new Date(1000 * 60 * 60);
var date1 = new Date(1546354578234);
console.log(date1);

var date2 = new Date("2019-10-01 8:0:0");
var date2 = new Date("2019-10-1");//如果不写时间 只写年月日 那么时间按照00点来计算
var date2 = new Date("8:0:0");//Invalid Date 如果不写年月日 那么时间是错误的
console.log(date2);

var date3 = new Date(2019,9,1,8,10,20,300);//当数字形式传递或者获取月份的时候，月份是从0开始算  0 代表 1月
var date3 = new Date(2019,16,1,8,10,20,300);//时间超出分为 会自动向前进一位  但是不建议这么写
console.log(date3);

获取时间

时间对象 无论是当前的时间还是我们设置的时间 都拥有获取精确年月日等等单独时间的方法。

  • 获取年份 getFullYear
  • 获取月份 getMonth
  • 获取日 getDate
  • 获取小时 getHours
  • 获取分钟 getMinutes
  • 获取秒 getSeconds
  • 获取毫秒 getMilliseconds
  • 获取星期 getDay
  • 获取当前距离1970年1月1日80000 的毫秒数 getTime
var now = new Date();

//获取年份
var nowYear = now.getFullYear();
// var nowYear = now.getYear();//只获取后两位  2000年之前的方法。我们不推荐使用
console.log(nowYear);//2019
console.log(typeof nowYear);//number

//获取月份
var nowMonth = now.getMonth();
console.log(nowMonth);//7  代表8月  月份从0开始计算

//获取日
var nowDate = now.getDate();
console.log(nowDate);//2

// 获取小时
var nowHours = now.getHours();
console.log(nowHours);//24小时时间

//获取分钟
var nowMinutes = now.getMinutes();
console.log(nowMinutes);//42

// 获取秒
var nowseconds = now.getSeconds();
console.log(nowseconds)//11

//获取毫秒
var nowMilliseconds = now.getMilliseconds();
console.log(nowMilliseconds);

// 获取星期
var nowDay = now.getDay();
console.log(nowDay);//5

//获取当前距离1970年1月1日8:00:00 的毫秒数
var nowTime = now.getTime();
console.log(nowTime);

北京时间练习

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>北京时间练习</title>
</head>
<body>
<div id="time">
<!--    当前时间是 2019 年 08 月 02 日 14 时 46 分 40秒 018毫秒-->

</div>
<script>
    var oTime = document.getElementById("time");
    //给 月 日 时 分 秒 添加0的函数
    function addZero(n) {
        return n>10 ? n : "0"+n;
    }
    function getNowTime() {
        var now = new Date();

        var y = now.getFullYear();

        var m = now.getMonth() + 1;
        m = addZero(m);

        var d = now.getDate();
        d = addZero(d);

        var h = now.getHours();
        h = addZero(h);

        var min = now.getMinutes();
        min = addZero(min);

        var s = now.getSeconds();
        s = addZero(s);

        var mili = now.getMilliseconds();
        if (mili < 10){
            mili = "00" + mili;
        } else if (mili<100){
            mili = "0" + mili;
        }

        var nowTime = y + "年" + m + "月" + d + "日" + h + "时" + min + "分" + s + "秒" + mili + "毫秒"
        oTime.innerHTML = nowTime;
    }

    var timer = setInterval(getNowTime,1);
</script>
</body>
</html>

设置单独的时间

  • 设置年份 setFullYear
  • 设置月份 setMonth
  • 设置日 setDate
  • 设置小时 setHours
  • 设置分钟 setMinutes
  • 设置秒 setSeconds
  • 设置毫秒 setMilliseconds
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>设置时间</title>
</head>
<body>
<script>
    var now = new Date();

    //设置年份
    now.setFullYear(2023);
    console.log(now);

    //设置月份
    now.setMonth(0);
    console.log(now);

    //设置日期
    now.setDate(4);
    console.log(now);

    //设置 小时
    now.setHours(19);
    console.log(now);

    //设置分钟
    now.setMinutes(40);
    console.log(now);

    //设置秒
    now.setSeconds(10);
    console.log(now);

    //设置毫秒
    now.setMilliseconds(100);
    console.log(now)

    //设置星期  不允许 没有这个方法
    now.setDay();
    console.log(now);
</script>
</body>
</html>

设置时间练习

设置一个3天后的当前时间

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>设置时间练习</title>
</head>
<body>
<script>
    //设置一个3天后的当前时间
   /* //获取当前时间
    var now = new Date();
    //获取当前时间的日期
    var nowDate = now.getDate();
    //让当前的日期 加上3
    newDate = nowDate+3;

    // 获取一个当前的时间，然后把当前时间的日期 设置为newDate
    // console.log(newDate)
    var newTime = new Date();
    newTime = newTime.setDate(newDate);
    console.log(newTime);*/


    var threeDatLast = new Date();
    threeDatLast.setDate(new Date().getDate()+3);
    console.log(threeDatLast.toLocaleString());
</script>
</body>
</html>

获取时间戳

时间戳：1970年1月1日 8点距离现在的毫秒数

// 获取时间戳
//方法1:  通过getTime（）
var now = new Date();
var time = now.getTime();
console.log(time);

// 方法二 将时间对象转换成数字   Number  一元运算
var now = new Date();
var time = Numb er(now);
console.log(time);

var time = + now;
console.log(time);

var time = parseInt(now);//parseInt不能转
console.log(time);

//方法三  valueOf 返回当前对象的最原始的值
var time = now.valueOf();
console.log(time);

//方法四 Date对象 不用实例化  直接拥有一个now方法  返回当前的毫秒数
var time = Date.now();
console.log(time);

计算代码运行时间1

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计算代码运行时间</title>
</head>
<body>
<script>
    var start = new Date();

    var num = 0;
    for (var i = 0; i < 100000000; i++) {
        num += i;
    }

    var end = new Date();

    // 两个时间对象相减 可以直接得到毫秒数
    console.log(end - start);
</script>
</body>
</html>

计算代码运行时间2

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计算代码运行时间</title>
</head>
<body>
<script>
    console.time("name");
    var num = 0; 
    for (var i = 0; i < 100000000; i++) {
        num += i;
    }
    console.timeEnd("name");

    /* console.time() 中需要传递一个参数 代表当前计算时间的代号
     console.timeEnd() 中需要传递一个参数 查找相同参数的 time   然后计算出来之间的差值时间  并打印*/
</script>
</body>
</html>

倒计时效果

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>倒计时</title>
</head>
<body>
<div id="con">

</div>
<script>

    function fn1() {
        //获取距离国庆节还有多少时间
        var guoqing = new Date(2019,9,1,8,0,0);//国庆节时间
        var now = new Date();//当前时间
        var reduceTime = guoqing - now;//距离国庆假还有多少毫秒数
        // console.log(reduceTime)h;

        // 获取天
        var date = parseInt(reduceTime / (1000 * 60 * 60 * 24));
        date < 10 ? date = "0" + date : date;

        // 获取小时
        var _date = reduceTime % (1000 * 60 * 60 * 24);
        var hours =parseInt( _date / (1000 * 60 * 60 ));
        hours < 10 ? hours = "0" + hours : hours;


        // 获取分钟
        var _hours = _date % (1000 * 60 * 60);
        var minu =parseInt( _hours / (1000 * 60 ));
        minu < 10 ? minu = "0" + minu : minu;

        // 获取秒
        var _minu = _hours % (1000 * 60);
        var sec =parseInt( _minu / (1000 ));
        sec < 10 ? sec = "0" + sec : sec;

        var str = "距离国庆假还有" + date + "天" + hours + "小时" + minu + "分" + sec + "秒";
        document.getElementById("con").innerHTML = str;
    }
    setInterval(fn1,1000);
</script>
</body>
</html>
posted @ 2023-01-12 21:54  z_bky  阅读(39)  评论(0)    收藏  举报