本篇讲解JS 使用Date对象的一些基础:
1.获取当前时间,年-月-日 时:分:秒,以及当前星期几
2.设置时间,比如现在是 2019年7月21日 00:00:00,而我想要改成2018年5月20日 13:14:00
代码:
<html lang="en"> <head> <title>Date日期时间</title> </head> <body> <div> Q:当前时间是? </div> <div id="newDateTime"> A: <span></span> </div> <div> Q:今天星期几呢? </div> <div id="newWeeks"> A: <span></span> </div> <div> <p>假如,我想要改变时间,也可以设置。 <br/> 以下的时间,是我在JS里进行设置的</p> </div> <div> Q:你希望现在是什么时间? </div> <div id="assumingTime"> A: <span></span> </div> <script> //绑定元素 var newDateTime = document.getElementById("newDateTime"); var newWeeks = document.getElementById("newWeeks"); var assumingTime = document.getElementById("assumingTime"); //定义日期 var date = new Date(); //获取年 var year = date.getFullYear(); //获取月 var month = parseInt(date.getMonth()) + 1; //因为是从0开始,所以需要加1 //获取日 var day = date.getDate(); //获取时 var hours = date.getHours(); //获取分 var minutes = date.getMinutes(); //获取秒 var seconds = date.getSeconds(); //调用封装的函数 month = toDateTime(month); day = toDateTime(day); hours = toDateTime(hours); minutes = toDateTime(minutes); seconds = toDateTime(seconds); /* * 下面使用到了children * 获取元素的子元素,有两种:1.children 2.childNodes * childNodes 属性返回所有的节点,包括文本节点、注释节点; * children 属性只返回元素节点; * */ //将当前时间显示到页面上 newDateTime.children[0].innerText = year+'-'+month+'-'+day+' '+hours+':'+minutes+':'+seconds; //获取星期几 var weeks = date.getDay(); //星期天为 0, 星期一为 1, 以此类推。 if(weeks == 0){ weeks = '星期天'; }else if(weeks == 1){ weeks = '星期一'; }else if(weeks == 2){ weeks = '星期二'; }else if(weeks == 3){ weeks = '星期三'; }else if(weeks == 4){ weeks = '星期四'; }else if(weeks == 5){ weeks = '星期五'; }else if(weeks == 6){ weeks = '星期六'; } //将星期几显示到页面上 newWeeks.children[0].innerText = weeks //我希望的时间 var assumingDate = new Date(); //需要重新定义一个时间 //设置年 assumingDate.setFullYear(2018); var assuming_year = assumingDate.getFullYear(); //设置月 assumingDate.setMonth(5); var assuming_month = assumingDate.getMonth(); //设置日 assumingDate.setDate(20); var assuming_day = assumingDate.getDate(); //设置时 assumingDate.setHours(13); var assuming_hours = assumingDate.getHours(); //设置分 assumingDate.setMinutes(14); var assuming_minutes = assumingDate.getMinutes(); //设置秒 assumingDate.setSeconds(0); var assuming_seconds = assumingDate.getSeconds(); //调用封装的函数 assuming_year = toDateTime(assuming_year); assuming_month = toDateTime(assuming_month); assuming_day = toDateTime(assuming_day); assuming_hours = toDateTime(assuming_hours); assuming_minutes = toDateTime(assuming_minutes); assuming_seconds = toDateTime(assuming_seconds); //将我希望的时间,显示在页面上 assumingTime.children[0].innerText = assuming_year+'-'+assuming_month+'-'+assuming_day+' '+assuming_hours+':'+assuming_minutes+':'+assuming_seconds; /* * 封装一个方法,用于拼接时间,前面的0 * @param number * */ function toDateTime(number){ if(number < 10) { return number = '0' + number; } return number; } </script> </body> </html>
效果: