本文實(shí)例講述了JS實(shí)現(xiàn)簡(jiǎn)單的天數(shù)計(jì)算器。分享給大家供大家參考,具體如下:
創(chuàng)新互聯(lián)公司主要從事成都網(wǎng)站設(shè)計(jì)、成都網(wǎng)站制作、網(wǎng)頁(yè)設(shè)計(jì)、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)高郵,10余年網(wǎng)站建設(shè)經(jīng)驗(yàn),價(jià)格優(yōu)惠、服務(wù)專業(yè),歡迎來(lái)電咨詢建站服務(wù):028-86922220
剛學(xué)了JS,想做個(gè)計(jì)算兩個(gè)日期之間相差天數(shù)的東西,因?yàn)楸救丝偸且憔嚯xXX還有多少天。。
開(kāi)始用很笨的方法寫了一個(gè),寫完百度了一下,發(fā)現(xiàn)用 Date() 的話 幾行代碼就可以搞定。自己看語(yǔ)法的時(shí)候一掃而過(guò),覺(jué)得會(huì)了,其實(shí)是不會(huì)的,至少在該用它的時(shí)候都想不到他有這個(gè)功能,這就是掌握類庫(kù)的重要性吧。
先放上寫的很笨的那種方法:
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>天數(shù)計(jì)算器</title> <script src="../lib/js/jquery-2.1.1.js"></script> <script src="year.js"></script> </head> <body> <h3>天數(shù)計(jì)算器</h3> <div> <label>起:</label> <input type="text" id="beginYear"> <label >年</label> <input type="text" id="beginMonth"> <label >月</label> <input type="text" id="beginDay"> <label >日</label> </div> <br> <div> <label>止:</label> <input type="text" id="endYear"> <label >年</label> <input type="text" id="endMonth"> <label >月</label> <input type="text" id="endDay"> <label >日</label> </div> <br> <div> <input type="button" id="submit" value="確定" onclick="days()"> <input type="button" id="cancel" value="取消"> </div> <script> function days() { // 一年的第幾天 var day1 = YEAR.dayOfYear( Number($("#beginYear").val()), Number($("#beginMonth").val()) ) + Number($("#beginDay").val()); var day2 = YEAR.dayOfYear( Number($("#endYear").val()), Number($("#endMonth").val()) ) + Number($("#endDay").val()); var year1 = Number($("#beginYear").val()); var year2 = Number($("#endYear").val()); if ( year1 < year2 ) { var sum = YEAR.yearCount( Number($("#beginYear").val()), Number($("#endYear").val()) ); if ( YEAR.isLeapYear( year1 ) ) sum = sum + (366 - day1) + day2; else sum = sum + (365 - day1) + day2; alert("之間有" + sum + "天!"); } else if ( year1 == year2 ) { sum = day2 - day1; alert("之間有" + sum + "天!"); } else { $(function() { alert("請(qǐng)輸入正確的起止時(shí)間!"); }); } } </script> </body> </html>
year.js
window.YEAR = { // 判斷是不是閏年 isLeapYear : function (year) { if((year % 4 == 0 && year % 100 !=0 ) || year % 400 == 0) return true; else return false; }, // 相差的整年數(shù),換算成天數(shù) yearCount : function (yearBefore, yearAfter) { var year = yearBefore + 1; var sum = 0; while (year < yearAfter) { if ( YEAR.isLeapYear(year) ) sum = sum + 366; else sum = sum + 365; year++; } return sum; }, // 一年中的第幾天,只計(jì)算到月份 dayOfYear : function (year, month ) { var myYear = year; var sum = 0; for(var i = 1; i < month; i++) { switch(i) { case 1: case 3: case 5: case 7: case 8: case 10: sum = sum + 31; break; case 4: case 6: case 9: case 11: sum = sum + 30; break; case 2: if(YEAR.isLeapYear(myYear)) sum = sum + 29; else sum = sum + 28; break; } } return sum; }, };
下面說(shuō)另一種方法,主要用到Date里面的Date.parse(),具體使用詳情,w3school上面有。下面代碼~
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>天數(shù)計(jì)算器</title> <script src="../lib/js/jquery-2.1.1.js"></script> <script src="year.js"></script> </head> <body> <h3>天數(shù)計(jì)算器</h3> <div> <label>起:</label> <input type="text" id="beginYear"> <label >年</label> <input type="text" id="beginMonth"> <label >月</label> <input type="text" id="beginDay"> <label >日</label> </div> <br> <div> <label>止:</label> <input type="text" id="endYear"> <label >年</label> <input type="text" id="endMonth"> <label >月</label> <input type="text" id="endDay"> <label >日</label> </div> <br> <div> <input type="button" id="submit" value="確定" onclick="test()"> <input type="button" id="cancel" value="取消"> </div> <script> function test() { var minutes = 1000 * 60 var hours = minutes * 60 var days = hours * 24 var y1 = Number($("#beginYear").val()); var m1 = Number($("#beginMonth").val()); var d1 = Number($("#beginDay").val()); var y2 = Number($("#endYear").val()); var m2 = Number($("#endMonth").val()); var d2 = Number($("#endDay").val()); var date1 = $("#beginYear").val() +',' + $("#beginMonth").val() +','+ $("#beginDay").val(); var date2 = $("#endYear").val() +','+ $("#endMonth").val() + ','+$("#endDay").val(); var day1 = Date.parse(date1); var day2 = Date.parse(date2); d = day2 - day1; d = d / days; alert("之間有" + d + "天!"); } </script> </body> </html>
以后要繼續(xù)優(yōu)化界面,爭(zhēng)取使用起來(lái)感覺(jué)更好,尤其是界面~
PS:這里再為大家推薦幾款比較實(shí)用的天數(shù)計(jì)算在線工具供大家使用:
在線日期/天數(shù)計(jì)算器:
http://tools.jb51.net/jisuanqi/date_jisuanqi
在線日期計(jì)算器/相差天數(shù)計(jì)算器:
http://tools.jb51.net/jisuanqi/datecalc
在線日期天數(shù)差計(jì)算器:
http://tools.jb51.net/jisuanqi/onlinedatejsq
在線天數(shù)計(jì)算器:
http://tools.jb51.net/jisuanqi/datejsq
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《JavaScript時(shí)間與日期操作技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
新聞標(biāo)題:JS實(shí)現(xiàn)簡(jiǎn)單的天數(shù)計(jì)算器完整實(shí)例
網(wǎng)頁(yè)網(wǎng)址:http://bm7419.com/article42/jdjdec.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供做網(wǎng)站、網(wǎng)站內(nèi)鏈、標(biāo)簽優(yōu)化、網(wǎng)站排名、、關(guān)鍵詞優(yōu)化
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)