使用JS判断一个日期是这一年的第几天。
image
首先我们先整理一下思路：
假如是12月11日，那么我们需要将1-11月的天数加起来，然后加上12月的11天。
假如是1月9日，那么我们只需要将1月的这九天就可以了。
那么这样的话首先我们可以使用if else去判断，但是用if else的话效率是很低的，这里我们可以使用switch的case穿透效果来优化代码：
/*
* year ：年份
* month：月份
* day ：日
* days ：总天数
*
* 思路：比如是12月，则从11月加到1月，最后加上12月的日期；
**/
switch ( parseInt(month) ) {
case 12:
days += 30;
case 11:
days += 31;
case 10:
days += 30;
case 09:
days += 31;
case 08:
days += 31;
case 07:
days += 30;
case 06:
days += 31;
case 05:
days += 30;
case 04:
days += 31;
case 03:
if(leapYear(year)){
days += 29;
} else{
days += 28;
}
case 2:
days += 31;
case 1:
days += 0;
break;
default:
show.innerText = "请输入正确的日期";
break;
}
这里我们需要判断一下是闰年还是平年，如果是闰年的话2月份为29天：
// 判断闰年
function leapYear(year){
if(year % 4 === 0 && year % 100 !== 0 || year % 400 === 0){
return true;
} else{
return false;
}
}
完整代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>根据日期，判断这个日期是这一年的第几天。 (使用switch 穿透编写)例如： 2016，02，11，计算后结果为42</h1>
<hr>
<p>选择日期：<input type="date" id="inDate" οninput="getDays()"></p>
<p id="show"></p>
</body>
<script>
var inDate = document.getElementById("inDate");
var show = document.getElementById("show");
/*
* year : 年
* month: 月
* day : 日
* days : 天数
**/
var year = null, month = null, day = null, days = 0;
function getDays(){
year = inDate.value.slice(0, 4);
month = inDate.value.slice(5, 7);
day = inDate.value.slice(8, 10);
/*
* 思路：比如是12月，则从11月加到1月，最后加上12月的日期；
**/
switch ( parseInt(month) ) {
case 12:
days += 30;
case 11:
days += 31;
case 10:
days += 30;
case 09:
days += 31;
case 08:
days += 31;
case 07:
days += 30;
case 06:
days += 31;
case 05:
days += 30;
case 04:
days += 31;
case 03:
if(leapYear(year)){
days += 29;
} else{
days += 28;
}
case 2:
days += 31;
case 1:
days += 0;
break;
default:
show.innerText = "请输入正确的日期";
return;
}
days += parseInt(day);
show.innerText = month + "月" + day + "日是" + year + "年的第" + days + "天";
days = 0;
}
// 判断闰年
function leapYear(year){
if(year % 4 === 0 && year % 100 !== 0 || year % 400 === 0){
return true;
} else{
return false;
}
}
</script>
</html>
网友评论