效果图：

 <html>

 <head>

 <script language="javascript">

 /*@ 解题思路：

     .计算本月有多少天（先要特殊处理2月，所以要先判断今年是平年还是闰年)

     .计算本月第一天是星期几。

     .计算本月日历的高度（即-需要几行显示，列是固定的7列)

 */

 function is_leap(year) { //闰年条件 能被4整除不能被100整除、或者能被400整除

    return (year%100==0?res=(year%400==0?1:0):res=(year%4==0?1:0));

 } //是否为闰年，如果能被100整除再判断是否能被400整除（如果能被400整除则一定能被100整除），如果不能被100整除再判断是否能被4整除。

 var nstr=new Date(); //当前Date

 var ynow=nstr.getFullYear(); //年份

 var mnow=nstr.getMonth(); //月份

 var dnow=nstr.getDate(); //今日日期

 var n1str=new Date(ynow,mnow,1); //当今年本月的第一天Date

 var firstday=n1str.getDay(); //当月第一天星期几，getDay()返回一周中的某一天

 var m_days=new Array(31,28+is_leap(ynow),31,30,31,30,31,31,30,31,30,31); //各月份的总天数

 var tr_str=Math.ceil((m_days[mnow] + firstday)/7); //表格所需要行数

 //打印表格第一行（有星期标志）

 document.write ("<table border='1' align='center' width='220' cellspacing='0'><thead><tr><th colspan='7'>"+"Today is "+ynow+'.'+(mnow+1)+'.'+dnow +"</th></tr></thead><tr><td align='center'>日</td><td align='center'>一</td><td align='center'>二</td><td align='center'>三</td><td align='center'>四</td><td align='center'>五</td><td align='center'>六</td></tr>");

 for(i=0;i<tr_str;i++) { //表格的行

    document.write("<tr>");

    for(k=0;k<7;k++) { //表格每行的单元格

       idx=i*7+k; //单元格自然序列号

       date_str=idx-firstday+1; //计算日期

       (date_str<=0 || date_str>m_days[mnow]) ? date_str="&nbsp;" : date_str=idx-firstday+1; //过滤无效日期（小于等于零的、大于月总天数的）

       //打印日期：今天底色为红

       date_str==dnow ? document.write ("<td align='center' bgcolor='red'>" + date_str + "</td>") : document.write ("<td align='center'>" + date_str + "</td>");

    }

    document.write("</tr>"); //表格的行结束

 }

 document.write("</table>"); //表格结束

 </script>

 </head>

 <body>

 </body>

 </html>

JavaScript 日历的更多相关文章

  1. 推荐一款JavaScript日历控件：kimsoft-jscalendar

    一.什么是 kimsoft-jscalendar     一个简洁的avaScript日历控件,可在Java Web项目,.NET Web 项目中使用 二.kimsoft-jscalendar 有什么 ...

  2. javascript日历插件

    原文:javascript日历插件 javascript日历插件 最近在尝试着写javascript日历插件,所以也到github上看国外人日历源码,或者国内人写的好点的,也在研究点,虽然看到网上有一 ...

  3. JavaScript日历控件开发 C# 读取 appconfig文件配置数据库连接字符串，和配置文件 List<T>.ForEach 调用异步方法的意外 ef 增加或者更新的习惯思维 asp.net core导入excel 一个二级联动

    JavaScript日历控件开发   概述 在开篇之前,先附上日历的代码地址和演示地址,代码是本文要分析的代码,演示效果是本文要实现的效果代码地址:https://github.com/aspwebc ...

  4. Javascript 日历插件

    1. The Coolest Calendar 界面非常漂亮的一款日期选择插件,有详细的使用文档,最新版本 1.5. 点击下载    查看示例 2. DatePicker 这款日期插件支持单选.多选和 ...

  5. 12款优秀的 JavaScript 日历和时间选择控件

    这些插件能够帮助  Web 开发人员更快速的实现各种精美的日历和时间选择效果. 1. The Coolest Calendar 界面非常漂亮的一款日期选择插件,有详细的使用文档,最新版本 1.5. 点 ...

  6. javascript日历控件——纯javascript版

    平时只有下班时间能code,闲来写了个纯javascript版.引用该calendar.js文件,然后给要设置成日历控件的input的id设置成calendar,该input就会变成日历控件. < ...

  7. javascript日历控件

    以前要用到日历控件都是直接从网上下载一套源码来使用,心里一直有个梗,就是想自己动手写一个日历控件,最近刚好来了兴趣,时间上也允许,于是自己摸索写了一个,功能还算完善,界面就凑合了.可能最值得说的一点就 ...

  8. JavaScript日历控件开发

    概述 在开篇之前,先附上日历的代码地址和演示地址,代码是本文要分析的代码,演示效果是本文要实现的效果 代码地址:https://github.com/aspwebchh/javascript-cont ...

  9. JavaScript日历（es5版本）

    近期在知乎上看到这么一个帖子,题主说自己JavaScript都学完了,结果老师留的作业还是不会写,就是写一个日历的插件,结果楼下一堆大牛出现了,百度的阿里的纷纷站出来发表自己的看法,有人认为简单,有人 ...

随机推荐

  1. android 点亮屏幕与锁定屏幕

    PowerManager pm=(PowerManager) getSystemService(Context.POWER_SERVICE); //获取电源管理器对象 PowerManager.Wak ...

  2. Redis集群(六)：集群常用命令及说明

    一.本文目的        介绍集群的基本情况及常用命令      二.集群的特点    3.集群优缺点 三.集群客户端命令(redis-cli -c -p port) 集群cluster info ...

  3. 【BZOJ 2809】【APIO 2012】dispatching

    昨天晚上zyf神犇问我的题,虽然我太弱参加不了APIO但也做一做吧. 用小数据拍了无数次总是查不出错来,交上去就WA,后来用国内数据测发现是主席树上区间相减的值没有用long long存,小数据真是没 ...

  4. 逻辑回归&&code

    没有正则化项的时候的二分类 #-*-coding=utf-8-*- from numpy import loadtxt,where, transpose import matplotlib.pyplo ...

  5. EM算法

    EM算法的推导

  6. 几种Aop实现及Castle.DynamicProxy的使用

    AoP(Aspect Oriented Programming,面向切面编程) .Net平台AOP技术研究 简单实现 通过继承实现 public interface ICoding { void Do ...

  7. JAVA gc垃圾回收机制

    一.GC概要   JVM堆相关知识     为什么先说JVM堆?     JVM的堆是Java对象的活动空间,程序中的类的对象从中分配空间,其存储着正在运行着的应用程序用到的所有对象.这些对象的建立方 ...

  8. 使用navicat连接mysql要报10038的错误

    1.mysql的设置 (1)授权mysql>grant all privileges on *.*  to  'root'@'%'  identified by 'youpassword'  w ...

  9. Hadoop实战第一篇

    前言:  都说现在是草根为尊的时代,近年来hadoop及spark技术在国内越来越流行.而且渐渐现成为企业的新宠.在DT时代全面来临之前,能提早接触大数据的技术必然能先人一步.本文作为Hadoop系列 ...

  10. 【BZOJ-1976】能量魔方Cube 最小割 + 黑白染色

    1976: [BeiJing2010组队]能量魔方 Cube Time Limit: 10 Sec  Memory Limit: 64 MBSubmit: 884  Solved: 307[Submi ...