计算机日历


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>日历联系</title>
<script type="text/javascript" src="js/jquery-3.2.1.min.js" ></script>
</head>
<body>
    <table id="calendar" cellpadding="10" cellspacing="0">
     <style>
     #calendar{width: 300px;border-bottom: solid 1px #000000;border-top: solid 1px #000000;border-left: solid 1px #000000;border-right: solid 1px #000000;}
     </style>
     <tr>
     <td colspan="7" align="center"><span id="thisYear"></span>年<span id="thisMonth"></span>月</td>
     </tr>
     <tr>
     <td id="date1"></td>
     <td id="date2"></td>
     <td id="date3"></td>
     <td id="date4"></td>
     <td id="date5"></td>
     <td id="date6"></td>
     <td id="date7"></td>
     </tr>
    
     <tr>
     <td id="date8"></td>
     <td id="date9"></td>
     <td id="date10"></td>
     <td id="date11"></td>
     <td id="date12"></td>
     <td id="date13"></td>
     <td id="date14"></td>
     </tr>
    
     <tr>
     <td id="date15"></td>
     <td id="date16"></td>
     <td id="date17"></td>
     <td id="date18"></td>
     <td id="date19"></td>
     <td id="date20"></td>
     <td id="date21"></td>
     </tr>
    
     <tr>
     <td id="date22"></td>
     <td id="date23"></td>
     <td id="date24"></td>
     <td id="date25"></td>
     <td id="date26"></td>
     <td id="date27"></td>
     <td id="date28"></td>
     </tr>
    
     <tr>
     <td id="date29"></td>
     <td id="date30"></td>
     <td id="date31"></td>
     <td id="date32"></td>
     <td id="date33"></td>
     <td id="date34"></td>
     <td id="date35"></td>
     </tr>
    
     <tr>
     <td id="date36"></td>
     <td id="date37"></td>
     <td id="date38"></td>
     <td id="date39"></td>
     <td id="date40"></td>
     <td id="date41"></td>
     <td id="date42"></td>
     </tr>
    
     <script>
    
     var today = new Date();
    
     var thisMonth = today.getMonth()+1;
     var thisYear = today.getFullYear();
         if(thisMonth < 10 ){
          thisMonth = "0" + thisMonth;
         }
         var thisDate = today.getDate();
         var thisweekday = today.getDay();
         //每月的1日信息
         var firstDateweekday = (thisweekday - thisDate + 36)%7;
         alert(firstDateweekday);
         $("#thisYear").html(thisYear);
         $("#thisMonth").html(thisMonth);
         
         var dates = new Array();
         for(var i=0;i<firstDateweekday;i++){
          dates[i]=" ";
         }
         
         for(var i=0;i<=getMaxDates(thisYear,thisMonth);i++){
          dates[firstDateweekday+i] = i+1;
         }
         for(var i=0;i<dates.length;i++){
          $("#date"+i).html(dates[i])
         }
         console.log(dates)
         //计算每个月的最大天数
         function getMaxDates(year,month){
          if(month == 2){
          if(year%4==0){
          return 29;
          }else{
          return 28;
          }
          }else if(month==4 || month==6 || month==9||month==11){
                    return 30;
          }else{
          return 31;
          }
         }
        
     </script>
    </table>
</body>
<html>

posted on 2018-09-06 16:46  JETIME庚  阅读(252)  评论(0编辑  收藏  举报

导航