Time object

Acquisition of time

 // 1. Get the current time object
var date = new Date(a);// The current time object, note: this time is your computer time, usually used from the server time
console.log(date);

 // 2. The time of the object can be set
 2.1 Setting the time Mode 1:
 // The parameters are year month (note: 0-11 months) day minutes and seconds
 var date = new Date("2020"."Seven"."3");// Note that the "7" here stands for August
 console.log(date);//Mon Aug 03 2020 00:00:00 GMT+0800
 
//2.2 Setting the time Mode 2: The month is From January to December
// The year can be - /.
var date = new Date("The 2020-8-5 14:20:14");// Note that 8-5 represents August 5
console.log(date);//Wed Aug 05 2020 14:20:14 GMT+0800
Copy the code

Operation of time

var nowDate = new Date(a);console.log(nowDate);// Get the current time

// 1. Get year getFullYear; Note: parentheses are required
var year =   nowDate.getFullYear();
console.log(year);
// 2. Get month; Note in particular that the month from 0 to 11 is also indexed
var month = nowDate.getMonth();
console.log(month+1);  // The month must be incremented by 1
// 3. Get day getDate
 var day = nowDate.getDate();
 console.log(day);
// 4. Get week getDay
var day = nowDate.getDay(); // Especially to be distinguished from fetching days; Sunday is the implementation of 0, the rest normal 1-6;
console.log(day);
// 5. Access time: 24 hours
var hour = nowDate.getHours();
console.log(hour);
// 6.
var minute = nowDate.getMinutes();
console.log(minute);
// 7. Get seconds
var second = nowDate.getSeconds();
console.log(second); Summary: When getting the month, pay special attention to the month0-11Also index, execution is required to add1; Notice the difference between day and day.Copy the code

Write a clock JS

1. Obtain the current hour, minute, and second;

2. Minute = second to component + current minute;

3. Hour: the time when minutes turn into hours + the current hour;

// This version of the page will be refreshed from 0 to 1 second before the current rotation, user experience is not very good
setInterval(function(){
	var date = new Date(a);// The current time is the computer time
	var msecond = date.getMilliseconds(); // Get the number of milliseconds
	var second = date.getSeconds()+msecond/1000;  // Get the current second
	var minute = date.getMinutes() + second / 60;  // Get the time of current minute + current second
	var hour = date.getHours() + minute / 60; // Get the hours of the current hour + the current minute and second;
// var myhour =  date.getHours()>12?date.getHours()-12:date.getHours();
/ / calculate Angle
var dsecond = second / 60 * 360+msecond/1000;;  // The Angle of the second
var dminute = minute / 60 * 360;  // Divide the Angle occupied
var dhour = hour / 12 * 360;
hourEle.style.transform = "rotate(" + dhour + "deg)";
minuteEle.style.transform = "rotate(" + dminute + "deg)";
secondEle.style.transform = "rotate(" + dsecond + "deg)";
},1000)
		
Copy the code
// Slightly optimize the version
var run = function () {
var date=new Date(a);// Get the current time;
var msecond = date.getMilliseconds(); // Get the number of milliseconds
var second = date.getSeconds()+msecond/1000;  // Get the current second
var minute = date.getMinutes() + second / 60;  // Get the time of current minute + current second
var hour = date.getHours() + minute / 60;// Get the hours of the current hour + the current minute and second;

// Calculate the Angle
var dsecond = second / 60 * 360;  // The Angle of the second
var dminute = minute / 60 * 360;  // Divide the Angle occupied
var dhour = hour / 12 * 360;
// The first is the id name
hourEle.style.transform = "rotate(" + dhour + "deg)";
minuteEle.style.transform = "rotate(" + dminute + "deg)";
secondEle.style.transform = "rotate(" + dsecond + "deg)";
}
run(); // The browser executes it once it enters
setInterval(run,1000);// The interval will be executed after 1 second
Copy the code

2. Timestamp

Time stamp: the number of milliseconds in a time from Greenwich Mean Time (00:00.00, January 1, 1970);

How to get a timestamp: time object.getTime ();

var date = new Date(a);var time = date.getTime();
console.log(time);  // The current timestamp is the number of milliseconds from Greenwich Mean Time.
Copy the code

The use of time stamps: can do the actual difference between 2 times; Or countdown, seconds kill.

Note: timestamps in JS are milliseconds, and in many background timestamps are seconds.

Do a countdown

Generally, the time is obtained from the server

function fn(){
            var mdate=new Date("The 2021-8-29 08:36:25")
            var nowdate=new Date(a);var mtimeStamp=mdate.getTime();
            var nowtimeStamp=nowdate.getTime();
            var time=(mtimeStamp-nowtimeStamp)/1000;// The time difference between the two
        }
          
        function run() {
            // 1.
            var mdate = new Date("The 2021-09-01 09:00:00");  // Monday at 9 a.m
            // console.log(mdate);
            // 2. The current time object
            var nowDate = new Date(a);// The current time object

            // 3. Obtain the timestamp of the object and calculate the time difference between the two
            var mtimeStamp = mdate.getTime();  // Time stamp for class on Monday;
            var nowTimeStamp = nowDate.getTime(); // The timestamp of the current time;

            // The time difference from Monday
            var time = parseInt((mtimeStamp - nowTimeStamp) / 1000);// The timestamp calculates milliseconds, we need to convert to seconds, then do the following day/hour/minute/second conversion.
            // console.log(time);
            // Count the days
            var day = parseInt(time / 3600 / 24);
            // console.log(day);
            // Count the hours
            var hour = parseInt(time / 3600) % 24
            // console.log(hour);
            // Count the minutes
            var minute = parseInt(time / 60) % 60;
            // console.log(minute)
            / / calculate the seconds
            var second = parseInt(time % 60);
            // console.log(second);
            // document.write(" + day + day + hour + hour + minute + second + second "); // Write once every second

            // Replace the HTML code
            document.body.innerHTML = "There's still time for class on Monday." + day + "Day" + hour + "Hour" + minute + "Minutes" + second + "Seconds";
        }
        setInterval(run, 1000);// The interval is executed every 1 second
Copy the code

Summary idea: obtain the corresponding time stamps for the two countdown times, then calculate the time difference between the two times (), and finally convert the time difference into the corresponding day/hour/minute/second.