时间对象
时间的获取
// 1.获取当前时间对象
var date = new Date(); //当前的时间的时间对象,注意下 :这个时间是你的电脑时间,一般用的时间会从服务器获取
console.log(date);
// 2.时间对象的时间可以设置
// 2.1设置时间方式一:
// 参数分别是 年 月(注意:是从0-11月) 日 时 分 秒
var date = new Date("2020","7","3");//注意这里的"7"代表8月
console.log(date);//Mon Aug 03 2020 00:00:00 GMT+0800 (中国标准时间)
//2.2设置时间方式二:注意 月份就是 1-12月
//年份常用连接符号 可以是 - / .
var date = new Date("2020-8-5 14:20:14");//注意这里的8-5 代表8月5日
console.log(date);//Wed Aug 05 2020 14:20:14 GMT+0800 (中国标准时间)
时间的操作
var nowDate = new Date();
console.log(nowDate);//获取当前时间
// 1.获取年份 getFullYear; 注意:都需要加小括号
var year = nowDate.getFullYear();
console.log(year);
// 2.获取月份 ; 尤其注意 月份是 0-11 也是索引
var month = nowDate.getMonth();
console.log(month+1); // 获取的月份 一定要加1 才是现在的月份
// 3. 获取天 getDate
var day = nowDate.getDate();
console.log(day);
// 4.获取星期 getDay
var day = nowDate.getDay(); //尤其要和获取天区分开;星期日是执行0,其余正常1-6;
console.log(day);
// 5.获取时 : 24小时制
var hour = nowDate.getHours();
console.log(hour);
// 6.获取分 :
var minute = nowDate.getMinutes();
console.log(minute);
// 7.获取秒
var second = nowDate.getSeconds();
console.log(second);
总结:获取月份时,尤其注意 月份是 0-11 也是索引,执行是必须加1;
注意区分天date和星期day;
一、写一个时钟的js
1.获取当前的时 、分、 秒;
2.分钟 = 秒转成分 + 当前的分;
3.小时 :分转成小时 + 当前小时的时间;
//这个版本每次刷新一下页面会从0点等到持续1秒后再执行当前时间转动,用户体验感不太好
setInterval(function(){
var date = new Date(); //当前是的时间对象 电脑时间
var msecond = date.getMilliseconds(); // 获取毫秒数
var second = date.getSeconds()+msecond/1000; // 获取当前的秒
var minute = date.getMinutes() + second / 60; // 获取当前分 + 当前秒的时间
var hour = date.getHours() + minute / 60; //获取当前小时 + 当前分和秒所占的小时数;
// var myhour = date.getHours()>12?date.getHours()-12:date.getHours();
// 算角度
var dsecond = second / 60 * 360+msecond/1000;; //秒所占的角度
var dminute = minute / 60 * 360; //分所占的角度
var dhour = hour / 12 * 360;
hourEle.style.transform = "rotate(" + dhour + "deg)";
minuteEle.style.transform = "rotate(" + dminute + "deg)";
secondEle.style.transform = "rotate(" + dsecond + "deg)";
},1000)
//稍微优化下版本
var run = function () {
var date=new Date(); // 获取当前的时间;
var msecond = date.getMilliseconds(); // 获取毫秒数
var second = date.getSeconds()+msecond/1000; // 获取当前的秒
var minute = date.getMinutes() + second / 60; // 获取当前分 + 当前秒的时间
var hour = date.getHours() + minute / 60;//获取当前小时 + 当前分和秒所占的小时数;
//计算角度
var dsecond = second / 60 * 360; //秒所占的角度
var dminute = minute / 60 * 360; //分所占的角度
var dhour = hour / 12 * 360;
//第一位是id名
hourEle.style.transform = "rotate(" + dhour + "deg)";
minuteEle.style.transform = "rotate(" + dminute + "deg)";
secondEle.style.transform = "rotate(" + dsecond + "deg)";
}
run(); // 浏览器一进入的时候就会 先执行一次
setInterval(run,1000);// 先没有执行 需要等到 1秒之后才会间隔执行
二、时间戳
时间戳 : 一个时间距离格林威治时间(1970年1月1日0时0分0秒)的毫秒数 ;
如何获取时间戳 : 时间对象.getTime();
var date = new Date();
var time = date.getTime();
console.log(time); //当前的时间戳 就是 当前时间 距离 格林威治时间的毫秒数。
时间戳的用处:可以做2个时间之间的实际差 ;或者是倒计时 、秒杀。
注意 :时间戳在js里是毫秒,在很多后台传过来的时间戳是秒。
三、做一个倒计时
一般获取时间会通过服务端获取
function fn(){
var mdate=new Date("2021-8-29 08:36:25")
var nowdate=new Date();
var mtimeStamp=mdate.getTime();
var nowtimeStamp=nowdate.getTime();
var time=(mtimeStamp-nowtimeStamp)/1000;//两者间隔时间差
}
function run() {
// 1.全国上学时间对象 :
var mdate = new Date("2021-09-01 09:00:00"); //周一上午9点
// console.log(mdate);
// 2.现在的时间对象
var nowDate = new Date(); //现在的时间对象
// 3.获取对象的时间戳 ,计算中间的时间差
var mtimeStamp = mdate.getTime(); //周一上课的时间戳;
var nowTimeStamp = nowDate.getTime(); //当前时间的时间戳;
// 距离周一的时间差
var time = parseInt((mtimeStamp - nowTimeStamp) / 1000);//时间戳计算出的是毫秒,我们要转化成秒,再来做以下的天/时/分/秒转化。
// console.log(time);
// 算出天数
var day = parseInt(time / 3600 / 24);
// console.log(day);
// 算出小时数
var hour = parseInt(time / 3600) % 24
// console.log(hour);
// 算出分钟
var minute = parseInt(time / 60) % 60;
// console.log(minute)
// 算出秒
var second = parseInt(time % 60);
// console.log(second);
// document.write("距离周一上课还有" + day + "天" + hour + "小时" + minute + "分钟" + second + "秒");//每一秒执行一次,重复写一次
// 替换html代码
document.body.innerHTML = "距离周一上课还有" + day + "天" + hour + "小时" + minute + "分钟" + second + "秒";
}
setInterval(run, 1000);//时间间隔 每1秒执行一次
总结思路:把2个需要倒计时的时间获取到对应的 时间戳 ,然后再计算2个时间中的时间差(),最后把时间差转成对应的天/小时/分钟/秒。