js实现日期显示的一些操作
1、js获取当前日期(yyyy-mm-dd)
以下代码是获取到的当前日期:
1 var myDate = new Date(); 2 var year = myDate.getFullYear(); //获取完整的年份(4位,1970-????) 3 var month = myDate.getMonth()+1; //获取当前月份(1-12) 4 var day = myDate.getDate(); //获取当前日(1-31) 5 //获取完整年月日 6 var newDay = year + “-” + month + “-” + day;
2、点击实现日期的天数加减(yyyy-mm-dd)
点击俩个按钮分别可以实现日期的加减,如果本月天数达到最多,那么月份将会自动增加或减少
1 var n = 0; 2 dayChange(0) 3 $("#time-add").click(function(){ 4 n++; 5 dayChange(n); 6 }) 7 $("#time-less").click(function(){ 8 n--; 9 dayChange(n); 10 }) 11 function dayChange(n){ 12 var now = new Date();//今天 13 var tomo = new Date((now/1000+86400*n)*1000);//明天 14 var month = tomo.getMonth() + 1; 15 var strDate = tomo.getDate(); 16 var seperator1 = "-"; 17 if (month >= 1 && month <= 9) { 18 month = "0" + month; 19 } 20 if (strDate >= 0 && strDate <= 9) { 21 strDate = "0" + strDate; 22 } 23 var currentdate = tomo.getFullYear() + seperator1 + month + seperator1 + strDate; 24 $(".center-day").html(currentdate); 25 }
3、获取当前本周周一和本周周日的时间范围
不管当前是周几,都可以获取到当前所在这一周的起始时间
1 var now = new Date();//今天 2 week(now); 3 function week(now){ 4 var nowTime = now.getTime() ; 5 var day = now.getDay(); 6 var oneDayLong = 24*60*60*1000 ; 7 //获取本周所在周一 8 var MondayTime = nowTime - (day-1)*oneDayLong ; 9 //获取本周所在周末 10 var SundayTime = nowTime + (7-day)*oneDayLong ; 11 //转化日期 12 var monday = new Date(MondayTime); 13 var sunday = new Date(SundayTime); 14 var month = monday.getMonth() + 1; 15 var strDate = monday.getDate(); 16 var month1 = sunday.getMonth() + 1; 17 var strDate1 = sunday.getDate(); 18 if (month >= 1 && month <= 9) { 19 month = "0" + month; 20 } 21 if (month1 >= 1 && month1 <= 9) { 22 month1 = "0" + month1; 23 } 24 if (strDate >= 0 && strDate <= 9) { 25 strDate = "0" + strDate; 26 } 27 if (strDate1 >= 0 && strDate1 <= 9) { 28 strDate1 = "0" + strDate1; 29 } 30 currentdate = monday.getFullYear() + seperator1 + month + seperator1 + strDate + "至" + sunday.getFullYear() + seperator1 + month1 + seperator1 + strDate1; 31 $(".center-day").html(currentdate); 32}
4、点击实现每周范围的变化
点击改变的按钮将会改变显示一周范围的改变,如果有的在下一月或者下一年,那么将会自动显示,不会出现错误
1 var now = new Date();//今天 2 var n = 0; 3 week(now); 4 $("#week-add").click(function(){ 5 n++; 6 var date = new Date(now.getTime() + n*7*24*3600*1000); 7 week(date); 8 }) 9 $("#week-add").click(function(){ 10 n--; 11 var date = new Date(now.getTime() + n*7*24*3600*1000); 12 week(date); 13 }) 14 function week(now){ 15 var nowTime = now.getTime() ; 16 var day = now.getDay(); 17 var oneDayLong = 24*60*60*1000 ; 18 //获取本周所在周一 19 var MondayTime = nowTime - (day-1)*oneDayLong ; 20 //获取本周所在周末 21 var SundayTime = nowTime + (7-day)*oneDayLong ; 22//转化日期 23 var monday = new Date(MondayTime); 24 var sunday = new Date(SundayTime); 25 var month = monday.getMonth() + 1; 26 var strDate = monday.getDate(); 27 var month1 = sunday.getMonth() + 1; 28 var strDate1 = sunday.getDate(); 29 if (month >= 1 && month <= 9) { 30 month = "0" + month; 31 } 32 if (month1 >= 1 && month1 <= 9) { 33 month1 = "0" + month1; 34 } 35 if (strDate >= 0 && strDate <= 9) { 36 strDate = "0" + strDate; 37 } 38 if (strDate1 >= 0 && strDate1 <= 9) { 39 strDate1 = "0" + strDate1; 40 } 41 currentdate = monday.getFullYear() + seperator1 + month + seperator1 + strDate + "至" + sunday.getFullYear() + seperator1 + month1 + seperator1 + strDate1; 42 $(".center-day").html(currentdate); 43 }
5、获取当前月份的第一天和最后一天
能够获取到当前所在月份的第一天和最后一天,最后一天的日期是不固定的,能够获取到应有的日期
1 monthfen(0) 2 function monthfen(n){ 3 var now = new Date();//今天 4 var firstDate = new Date((now/1000+86400*n*now.getDate())*1000);//明天 5 //本月第一天 6 firstDate.setDate(1); //第一天 7 var date = new Date(firstDate); 8 var month = date.getMonth() + 1; 9 var strDate = "0" + date.getDate(); 10 //本月最后一天 11 var endDate = new Date(firstDate); 12 endDate.setMonth(firstDate.getMonth()+1); 13 endDate.setDate(0); 14 var date1 = new Date(endDate); 15 var month1 = date1.getMonth() + 1; 16 var strDate1 = date1.getDate(); 17 if (month >= 1 && month <= 9) { 18 month = "0" + month; 19 } 20 if (month1 >= 1 && month1 <= 9) { 21 month1 = "0" + month1; 22 } 23 currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate + "至" + date1.getFullYear() + seperator1 + month1 + seperator1 + strDate1; 24 $(".center-day").html(currentdate); 25 }
6、点击实现当前月份的改变
点击按钮会实现当前月份的改变,那么最后一天的日期也会自动改变,
1 monthfen(0) 2 var n = 0; 3 $("#month-add").click(function(){ 4 n++; 5 monthfen(n); 6 }) 7 $("#month-less").click(function(){ 8 n--; 9 monthfen(n); 10 }) 11 function monthfen(n){ 12 var now = new Date();//今天 13 var firstDate = new Date((now/1000+86400*n*now.getDate())*1000);//明天 14 //本月第一天 15 firstDate.setDate(1); //第一天 16 var date = new Date(firstDate); 17 var month = date.getMonth() + 1; 18 var strDate = "0" + date.getDate(); 19 //本月最后一天 20 var endDate = new Date(firstDate); 21 endDate.setMonth(firstDate.getMonth()+1); 22 endDate.setDate(0); 23 var date1 = new Date(endDate); 24 var month1 = date1.getMonth() + 1; 25 var strDate1 = date1.getDate(); 26 if (month >= 1 && month <= 9) { 27 month = "0" + month; 28 } 29 if (month1 >= 1 && month1 <= 9) { 30 month1 = "0" + month1; 31 } 32 currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate + "至" + date1.getFullYear() + seperator1 + month1 + seperator1 + strDate1; 33 $(".center-day").html(currentdate); 34 }
当然还有很多关于日期格式的改变和算法,如果有什么不理解的可以留下评论,大家一起探讨。