JS 时间运算大全
作者推荐
效果
开始时间:2021-1-1 12:10:10结束时间:2021-2-1 13:13:13时间差的毫秒数:2682183000计算出-相差天数:31计算出-小时数:1计算出-分钟数:3计算出-秒数 :3计算结果 : 相差 31天 1小时 3 分钟3 秒
html
<h1>作者推荐</h1> <div>开始时间:<span id="hot_ks"></span></div> <div>结束时间:<span id="hot_js"></span></div> <div>时间差的毫秒数:<span id="hot_sjc"></span></div> <div>计算出-相差天数:<span id="hot_xcts"></span></div> <div>计算出-小时数:<span id="hot_xss"></span></div> <div>计算出-分钟数:<span id="hot_fzs"></span></div> <div>计算出-秒数 :<span id="hot_ms"></span></div> <div>计算结果 :<span id="hot_jg"></span></div>
js-调用
//作者推荐 var Hot=function(){ var ks='2021-1-1 12:10:10'; var js='2021-2-1 13:13:13'; let data=TimeDifference(ks,js); $("#hot_ks").html(ks); $("#hot_js").html(js); $("#hot_sjc").html(data.Milliseconds); $("#hot_xcts").html(data.days.days); $("#hot_xss").html(data.days.hours); $("#hot_fzs").html(data.days.minutes); $("#hot_ms").html(data.days.seconds); $("#hot_jg").html(" 相差 " data.days.days "天 " data.days.hours "小时 " data.days.minutes " 分钟" data.days.seconds " 秒"); }; Hot();
js-公共函数
//作者推荐 function TimeDifference(d1, d2) { var date1 = new Date(d1); //开始时间 var date2 = new Date(d2); //结束时间 var Milliseconds = date2.getTime() - new Date(date1).getTime(); //时间差的毫秒数 //------------------------------ //计算出相差天数 var days = Math.floor(Milliseconds / (24 * 3600 * 1000)) //计算出小时数 var leave1 = Milliseconds % (24 * 3600 * 1000) //计算天数后剩余的毫秒数 var hours = Math.floor(leave1 / (3600 * 1000)) //计算相差分钟数 var leave2 = leave1 % (3600 * 1000) //计算小时数后剩余的毫秒数 var minutes = Math.floor(leave2 / (60 * 1000)) //计算相差秒数 var leave3 = leave2 % (60 * 1000) //计算分钟数后剩余的毫秒数 var seconds = Math.round(leave3 / 1000) var ResultJson = { days: { days: days >= 0 ? days : days 1, hours: hours >= 0 ? hours: hours 1, minutes: minutes >= 0 ? minutes : minutes 1, seconds: seconds >= 0 ? seconds: seconds 1 }, Milliseconds: Milliseconds }; return ResultJson; }
测试源码
注意引入jq
效果
代码
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>JS 时间运算</title> <script src="jquery.min.js"></script></head><body> <h1>作者推荐</h1> <div>开始时间:<span id="hot_ks"></span></div> <div>结束时间:<span id="hot_js"></span></div> <div>时间差的毫秒数:<span id="hot_sjc"></span></div> <div>计算出-相差天数:<span id="hot_xcts"></span></div> <div>计算出-小时数:<span id="hot_xss"></span></div> <div>计算出-分钟数:<span id="hot_fzs"></span></div> <div>计算出-秒数 :<span id="hot_ms"></span></div> <div>计算结果 :<span id="hot_jg"></span></div> <hr> <h1>JS 时间运算--天数运算--演示1</h1> <p style="color: #ccc;">转载：https://my.oschina.net/u/3913672/blog/2878194</p> <div>付款时间：<input type="text" name="fukuan" id="fukuan" value="2020-01-11"></div> <div>冲账期限（天）：<input type="text" name="chongzhang" id="chongzhang" value="1"></div> <div>延期天数：<input type="text" name="yanqi" id="yanqi">(*修改-然后按下 enter 键触发运算)</div> <div>计算结果的日期：<span id="jieguo_span"></span></div> <hr> <h1>JS 时间运算--天数运算--演示2</h1> <div>开始日期：<input type="text" name="kaishi" id="kaishi" value="2020-01-10"></div> <div>提前提醒天数：<input type="text" name="tixing" id="tixing" value="10"></div> <div>执行日期：<span id="zhixingshijian"></span></div> <div><input type="button" id="jisuan" value="执行计算"></div> <hr> <h1>Js计算时间差（天、小时、分钟、秒）--演示3</h1> <p style="color: #ccc;">转载：https://www.cnblogs.com/chenlove/p/8643036.html</p> <div>开始时间:<span id="demo3_kaishi"></span></div> <div>结束时间:<span id="demo3_jieshu"></span></div> <div>时间差的毫秒数:<span id="demo3_sjc"></span></div> <div>计算出-相差天数:<span id="demo3_xcts"></span></div> <div>计算出-小时数:<span id="demo3_xss"></span></div> <div>计算出-分钟数:<span id="demo3_fzs"></span></div> <div>计算出-秒数 :<span id="demo3_ms"></span></div> <div>计算结果 :<span id="demo3_jg"></span></div> <hr> <h1>演示4</h1> <h3>日期减去/加上天数等于第二个日期--演示4.1</h3> <p style="color: #ccc;">转载：https://blog.csdn.net/sat472291519/article/details/18077005</p> <div>开始时间:<span id="demo4_ks"></span></div> <div>天数:<span id="demo4_ts"></span></div> <div>减去结果:<span id="demo4_jg1"></span></div> <div>加上结果:<span id="demo4_jg11"></span></div> <h3>两个日期的差值(d1 - d2)--演示4.2</h3> <p style="color: #ccc;">转载：https://blog.csdn.net/sat472291519/article/details/18077005</p> <div>开始时间:<span id="demo4_kssj"></span></div> <div>结束时间:<span id="demo4_jssj"></span></div> <div>结果:<span id="demo4_jg2"></span></div> <div>结果:<span id="demo4_jg22"></span></div> <script type="text/javascript"> //例子1 $('#yanqi').change(function () { console.log('修改触发运算'); var beginTimeVal = $('#fukuan').val();//获取页面中的付款时间，格式为2017-01-11类型 days = $("#chongzhang").val().trim();//获取页面中的冲账期限（天）val（） days1 = $("#yanqi").val();//获取页面中的延期天数 console.log('付款时间:' beginTimeVal); console.log('冲账期限（天）:' days); console.log('延期天数:' days1); daysInt = parseInt(days) parseInt(days1);//强制转换为int类型【不转换不会报错但是时间不准确】 var val = addDate(beginTimeVal, daysInt);//调用已经封装好的函数addDate $('#nextTime').val(val); }) $("#jieguo_span").html(val); }); //例子2 $('#jisuan').click(function () { var kaishi = $('#kaishi').val(); var tixing = $('#tixing').val(); daysInt = parseInt(tixing);//强制转换为int类型【不转换不会报错但是时间不准确】 var val = addDate(kaishi, daysInt); $("#zhixingshijian").html(val); }); //例子3 var demo3 = function () { var date1 = '2020/12/01 00:00:00'; //开始时间 var date2 = new Date(); //结束时间 var date3 = date2.getTime() - new Date(date1).getTime(); //时间差的毫秒数 //------------------------------ //计算出相差天数 var days = Math.floor(date3 / (24 * 3600 * 1000)) //计算出小时数 var leave1 = date3 % (24 * 3600 * 1000) //计算天数后剩余的毫秒数 var hours = Math.floor(leave1 / (3600 * 1000)) //计算相差分钟数 var leave2 = leave1 % (3600 * 1000) //计算小时数后剩余的毫秒数 var minutes = Math.floor(leave2 / (60 * 1000)) //计算相差秒数 var leave3 = leave2 % (60 * 1000) //计算分钟数后剩余的毫秒数 var seconds = Math.round(leave3 / 1000) $("#demo3_kaishi").html(date1); $("#demo3_jieshu").html(date2.toLocaleString());//将一个日期按照本地操作系统格式显示 $("#demo3_sjc").html(date3); $("#demo3_xcts").html(days); $("#demo3_xss").html(hours); $("#demo3_fzs").html(minutes); $("#demo3_ms").html(seconds); $("#demo3_jg").html(" 相差 " days "天 " hours "小时 " minutes " 分钟" seconds " 秒"); }; demo3(); ///计算函数 //日期加减法 date参数为计算开始的日期，days为需要加的天数 //格式:addDate('2017-1-11',20) function addDate(date, days) { var d = new Date(date); //核心就是setDate()方法， date参数是要进行加减的日期，days参数是要加减的天数，如果往前算就传入负数，往后算就传入正数 ，注意js中的月份是0-11月，计算的时候要加1 d.setDate(d.getDate() days); var m = d.getMonth() 1; return d.getFullYear() '-' m '-' d.getDate(); } / //例子4 var demo4 = function () { //例子4.1 var ks = new Date(); var ts = 10; $("#demo4_ks").html(ks.toLocaleString()); //将一个日期按照本地操作系统格式显示 $("#demo4_ts").html(ts); $("#demo4_jg1").html(demo4_MinusDays(ks, ts)); $("#demo4_jg11").html(demo4_AddDays(ks, ts)); //例子4.2 var demo4_kssj = '2021-1-1';//开始 var demo4_jssj = '2021-10-1';//结束 $("#demo4_kssj").html(demo4_kssj); //将一个日期按照本地操作系统格式显示 $("#demo4_jssj").html(demo4_jssj); $("#demo4_jg2").html(demo4_DateDiff(demo4_jssj, demo4_kssj)); }; demo4(); //日期减去天数后的新日期. function demo4_MinusDays(dd, dadd) { //可以加上错误处理 var a = new Date(dd); a = a.valueOf(); a = a - dadd * 24 * 60 * 60 * 1000; a = new Date(a); return a.getFullYear() "-" (a.getMonth() 1) "-" a.getDate(); } //日期加上天数后的新日期. function demo4_AddDays(date, days) { var nd = new Date(date); nd = nd.valueOf(); nd = nd days * 24 * 60 * 60 * 1000; nd = new Date(nd); //alert(nd.getFullYear() "年" (nd.getMonth() 1) "月" nd.getDate() "日"); var y = nd.getFullYear(); var m = nd.getMonth() 1; var d = nd.getDate(); if (m <= 9) m = "0" m; if (d <= 9) d = "0" d; var cdate = y "-" m "-" d; return cdate; } // 这里不得不做补充,浪费好多时间得出教训: // Javascript 对时间的代号 // 0-11数字表示1-12月: var a= new Date(2006,5,6) 结果是2006-6-6 // 0-6表示星期 // 1-31表示日期 // 0-23小时 // 0-59分钟,秒 //两个日期的差值(d1 - d2). function demo4_DateDiff(d1, d2) { var day = 24 * 60 * 60 * 1000; try { var dateArr = d1.split("-"); var checkDate = new Date(); checkDate.setFullYear(dateArr[0], dateArr[1] - 1, dateArr[2]); var checkTime = checkDate.getTime(); var dateArr2 = d2.split("-"); var checkDate2 = new Date(); checkDate2.setFullYear(dateArr2[0], dateArr2[1] - 1, dateArr2[2]); var checkTime2 = checkDate2.getTime(); var cha = (checkTime - checkTime2) / day; return cha; } catch (e) { return false; } }//end fun //作者推荐 var Hot=function(){ var ks='2021-1-1 12:10:10'; var js='2021-2-1 13:13:13'; let data=TimeDifference(ks,js); $("#hot_ks").html(ks); $("#hot_js").html(js); $("#hot_sjc").html(data.Milliseconds); $("#hot_xcts").html(data.days.days); $("#hot_xss").html(data.days.hours); $("#hot_fzs").html(data.days.minutes); $("#hot_ms").html(data.days.seconds); $("#hot_jg").html(" 相差 " data.days.days "天 " data.days.hours "小时 " data.days.minutes " 分钟" data.days.seconds " 秒"); }; Hot(); //作者推荐 function TimeDifference(d1, d2) { var date1 = new Date(d1); //开始时间 var date2 = new Date(d2); //结束时间 var Milliseconds = date2.getTime() - new Date(date1).getTime(); //时间差的毫秒数 //------------------------------ //计算出相差天数 var days = Math.floor(Milliseconds / (24 * 3600 * 1000)) //计算出小时数 var leave1 = Milliseconds % (24 * 3600 * 1000) //计算天数后剩余的毫秒数 var hours = Math.floor(leave1 / (3600 * 1000)) //计算相差分钟数 var leave2 = leave1 % (3600 * 1000) //计算小时数后剩余的毫秒数 var minutes = Math.floor(leave2 / (60 * 1000)) //计算相差秒数 var leave3 = leave2 % (60 * 1000) //计算分钟数后剩余的毫秒数 var seconds = Math.round(leave3 / 1000) var ResultJson = { days: { days: days >= 0 ? days : days 1, hours: hours >= 0 ? hours: hours 1, minutes: minutes >= 0 ? minutes : minutes 1, seconds: seconds >= 0 ? seconds: seconds 1 }, Milliseconds: Milliseconds }; return ResultJson; } </script></body></html>
赞 (0)