<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title></title>
<style>
*{
margin:0 ;
padding:0;
}
.box{
line-height:40px;
font-size:16px;
text-align:center;
width: 280px;
height: 320px;
border:1px solid #ccc;
position:absolute;
top: 200px;
left:200px;
color:#000;
padding:20px;
}
.top{
font-size:0;
}
.top button{
width: 25%;
display:inline-block;
font-size:16px;
}
.top #month{
width: 50%;
display:inline-block;
font-size:16px;
}
.evrday{
width: 40px;
height: 40px;
float:left;
}
</style>
</head>
<body>
<div class="box">
<div class="top">
<button type="button" οnclick="prev()">上个月</button>
<div id="month"></div>
<button type="button" οnclick="next()">下个月</button>
</div>
<div class="week">
<div class="evrday">日</div>
<div class="evrday">一</div>
<div class="evrday">二</div>
<div class="evrday">三</div>
<div class="evrday">四</div>
<div class="evrday">五</div>
<div class="evrday">六</div>
</div>
<div id="day"></div>
</div>
<script>
var today=new Date();
var year=today.getFullYear();
var month=today.getMonth()+1;
var day=today.getDate();
var allday=0;
// var now=today.getDay();
// console.log(now)
console.log(today);
console.log(year);
console.log(month);
console.log(day);
count();
showmonth();
function count () {
if (month !=2){
allday = 31
if (month == 4 || month == 6 || month == 9 || month == 11){
allday = 30
}
} else {
if((year%4==0&&year%100!=0) || (year%400==0)){
day = 29
}else{
allday = 28
}
}
}
function showmonth(){
if(month < 10){
var year_month = year+" 年 "+"0" + month+" 月 ";
}else{
var year_month = year+" 年 "+month+" 月 ";
}
document.getElementById("month").innerHTML=year_month;
}
showday();
function showday(){
showmonth();
count();
var firstdate=new Date(year,month-1,1);
var xingqi=firstdate.getDay();
console.log(xingqi);
var daterow=document.getElementById("day");
for(var i=0;i<xingqi;i++){
var dayElement=document.createElement("div");
dayElement.className="evrday";
daterow.appendChild(dayElement);
}
for(var j=1;j<=allday;j++){
var dayElement=document.createElement("div");
if(j<10){
dayElement.innerHTML="0"+j;
}else{
dayElement.innerHTML=j;
}
dayElement.className="evrday";
if(j==day)
dayElement.style.color="red";
daterow.appendChild(dayElement);
}
}
function next(){
document.getElementById("day").innerHTML="";
if(month<12){
month+=1;
}else{
year+=1;
month=1;
}
showday();
}
function prev(){
document.getElementById("day").innerHTML="";
if(month>1){
month-=1;
}else{
month=12;
year-=1;
}
showday();
}
console.log(allday);
</script>
</body>
</html>
扫一扫
391
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
