js制作年历

<!DOCTYPE html>

<html>

  <head>

    <meta charset="UTF-8">

    <title>制作年历</title>

    <style>

      body{text-align:center;}

      .box{margin:0 auto;width:880px;}

      .title{background:#ccc;}

      table{height:200px;width:200px;font-size:12px;text-align:center;float:left;margin:10px;font-family:arial;}

    </style>

    <script src="calendar.js"></script>

    <script>

      var year = parseInt(prompt('输入年份:', '2017'));

      document.write(calendar(year));

      // 定义年历生成函数

function calendar(y) {

   

    // 获取指定年份1月1日的星期数值

    var w = new Date(y, 0).getDay();

    var html = '<div class="box">';

   

     // 拼接每个月份的表格

    for (m = 1; m <= 12; ++m) {

        html += '<table>';

        html += '<tr class="title"><th colspan="7">' + y + ' 年 ' + m + ' 月</th></tr>';

        html += '<tr><td>日</td><td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td></tr>';

   

        // 获取月份m共有多少天

        var max = new Date(y, m, 0).getDate();

       

       html += '<tr>';                         // 开始<tr>标签

        for (d = 1; d <= max; ++d) {

            if (w && d == 1) {                  // 如果该月的第1天不是星期日,则填充空白

                html += '<td colspan="' + w + '"> </td>';

            }

            html += '<td>' + d + '</td>';

            if (w == 6 && d != max) {           // 如果星期六不是该月的最后一天,则换行

                html += '</tr><tr>';

            } else if (d == max) {               // 该月的最后一天,闭合<tr>标签

                html += '</tr>';

            }

            w = (w + 1 > 6) ? 0 : w + 1;

        }

        html += '</table>';

    }

    html += '</div>';

    return html;

}

    </script>

  </head>

  <body></body>

</html>

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值