`
xie_en
  • 浏览: 1796 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

简单日历

阅读更多
    这两天需要用Javascript做一个简单的日历。网上查了很多,但是大都太复杂。在其中学会了关于日历的一些算法。特别总结一下。
    基本思路是根据系统获得的年、月作为参数,将日期填入表格中。
    主要方法包括判断是否闰年、判断每个月的第一天是星期几。然后用循环迭代的方式将日期填入表格。
   
function isleapyear(year) {
                     if (year % 400 == 0)  return true;
		     if (year % 4 == 0 && y % 100 != 0)  return true;
		     else  return false;
                 }

                 //Caculate What day the first day in a week. 			
		function first_day_in_week(y, m) {
//Array to store the arithmetical compliment that was divisibled by number of a month days.
		     var day_in_week = new Array(3, 0, 3, 2, 3, 2, 3, 3, 2, 3, 2, 3);
		     var leap_day_in_week = new Array(3, 1, 3, 2, 3, 2, 3, 3, 2, 3, 2, 3);	
		     var remainder = y - 2000;
				
//Add the leap days From 2001 Before this year.	
		     for (var j = 2001; j < y; j++) {
		         if (isleapyear(j)) {
			     remainder ++ ;
			 }						
		     }
		     if (isleapyear(y)) {
			 for (var i = 0; i < m - 1; i ++) {
			     remainder += leap_day_in_week[i];
			 }
		     } else {
		         for (var i = 0; i < m - 1; i ++) {
			     remainder += day_in_week[i];
		         }					
		     }
		     return remainder % 7;
		} 
			function show_calendar(y, m) {
				
				var fdiw = first_day_in_week(y, m);
//The leap year.
				if (isleap(year)) {
//The first line of Calendar.
					document.write("<tr>");
					
					for (var date = 0; date < 7; date ++) {
						if (date < fdiw) {
							document.write("<td>&nbsp;</td>");
						} else {
							document.write("<td>" + (date - fdiw + 1) + "</td>");
						}
					}
					
					document.write("</tr>");
					
//The other line of Calendar.
					data = 7 - fdiw - 1;
					for (var loop = 0; loop < 5; loop ++) {
						for (var day = 0; day < 7; day ++) {
							if (date <= leap_months[m - 1]) {
								if (day == 0) {
									document.write("<tr><td>" + date + "</td>"); 
								} else if (day == 6) {
									document.write("<td>" + date + "</td></tr>");	
								} else {
									document.write("<td>" + date + "</td>");
								}
								date ++;
							} else {
								document.write("&nbsp;");
							}
						}
					}
				} else {
					
					
//The unleap year.
//The first line of Calendar.
					document.write("<tr>");
					
					for (var date = 0; date < 7; date ++) {
						if (date < fdiw) {
							document.write("<td>&nbsp;</td>");
						} else {
							document.write("<td>" + (date - fdiw + 1) + "</td>");
						}
					}
					
					document.write("</tr>");
					
//The other line of Calendar.
					var date = 7 - fdiw + 1;
					for (var loop = 0; loop < 5; loop ++) {
						for (var day = 0; day < 7; day ++) {
							if (date <= months[m - 1]) {
								if (day == 0) {
									document.write("<tr><td>" + date + "</td>"); 
								} else if (day == 6) {
									document.write("<td>" + date + "</td></tr>");	
								} else {
									document.write("<td>" + date + "</td>");
								}
								date ++;
							} else {
								document.write("&nbsp;");
							}
						}
					}
				}
			}

    在table中调用show_calendar(year, month)就可以显示出对应月份的公历日历。然后可以用css添加样式实现想要实现的效果。
1
1
分享到:
评论

相关推荐

    CocosCreator开发简易日历

    在这个"简易日历"项目中,开发者利用CocosCreator的特性,构建了一个类似电脑桌面日历的应用。尽管这个日历可能不包含所有传统日历的功能,但它展示了如何在CocosCreator中实现基本的时间管理和用户界面设计。 首先...

    简易日历

    【简易日历】项目是一个基于源码实现的实用工具,旨在提供一个简洁、易用的日历功能。通过这个项目,我们可以学习到如何在编程中创建一个具有基本日历功能的应用,例如查看当前日期、切换月份以及标记特定日期等。...

    用c写的一个简易日历

    【标题】:“用C语言编写的一个简易日历” 在编程领域,C语言是一种基础且强大的编程语言,常用于系统编程、软件开发以及教学。本项目是利用C语言实现的一个简单的日历程序,对于初学者来说,这是一个很好的学习...

    iOS简单日历Demo

    在iOS开发中,创建一个简单的日历应用是一个常见的任务,这可以帮助用户查看和管理他们的日程安排。"iOS简单日历Demo"项目就是一个这样的实例,它展示了如何在iOS平台上实现基本的日历功能。这个Demo主要涉及到以下...

    02 简易日历.html

    简易日历

    Android应用源码之简易日历中心.zip

    在Android平台上,开发一款简易日历中心应用是一个常见的任务,涉及到日期管理、事件安排和用户交互等多个方面。这个"Android应用源码之简易日历中心.zip"提供的源代码可以帮助我们理解如何实现这样的功能。让我们...

    简易日历记事本源码(java+android端),含日历和日志记事本两部分

    这个项目名为"DuangCalender",是一个基于Java和Android开发的简易日历记事本应用。这个源码库包含了日历视图和日志记事本功能,旨在为用户提供一个简单而实用的日常管理工具。 在Java编程语言中,日历功能通常涉及...

    带标记的简易日历

    【标题】"带标记的简易日历"是一个项目,它可能是一个日历应用或库的示例,旨在提供一种简洁的方式展示日期,并且允许用户在特定日期上添加标记。这样的功能常见于各种日程管理软件,帮助用户追踪重要的事件、纪念日...

    Java实现简单日历小程序 Java图形界面小日历开发

    Java实现简单日历小程序 Java是当前最流行的编程语言之一,广泛应用于Android应用开发、Web开发、企业软件开发等领域。Javaswing是Java提供的一种图形用户界面(GUI)工具包,能够帮助开发者快速创建跨平台的图形...

    简单日历源码.zip

    《C#实现的简单日历源码解析》 在编程领域,C#是一种广泛使用的面向对象的编程语言,尤其在Windows应用开发中占有重要地位。本篇将详细解析一款使用C#编写的简单日历程序,它包含了阳历和阴历的显示功能,并能随...

    Android简易日历

    在Android平台上创建一个简易日历应用,涉及到许多关键技术和组件,包括Java编程语言、Android SDK、用户界面设计以及数据管理。下面将详细讲解这些知识点。 首先,基础是**Java编程语言**,它是Android开发的主要...

    js简易日历插件

    JavaScript简易日历插件是一种轻量级的交互组件,它能够方便地集成到网页中,为用户提供日期选择功能。这个插件的核心是JavaScript语言,它利用DOM操作和事件处理来实现日历的显示与交互。CSS文件则负责日历的样式...

    linux上用c语言写的简易日历

    这个简易日历程序是为初学者设计的,旨在帮助他们理解C语言的基本概念,同时接触与Linux系统交互的知识。下面将详细介绍这个项目的相关知识点。 1. **C语言基础**: C语言是一种结构化编程语言,具有高效、灵活...

    Android简易日历Demo

    在Android平台上,开发一款简易日历应用可以帮助用户方便地查看日期和管理事件。这个"Android简易日历Demo"提供了一个基础的学习平台,让开发者能够快速掌握如何在Android应用中实现日历功能。以下是对这个Demo涉及...

    购物车源码+简易日历源码+留言板源码

    这个压缩包包含三个重要的源码项目:购物车源码、简易日历源码和留言板源码,这些都是Web开发中常见的功能模块,对于初学者或者希望提升技能的开发者来说极具价值。 1. **购物车源码**: 购物车源码是电商网站的...

    Android高级应用源码-简易日历中心.zip

    【标题】"Android高级应用源码-简易日历中心.zip" 涵盖了Android平台上构建一个简单日历应用的核心技术。这个项目可能是为开发者提供一个学习和参考的实例,帮助他们理解如何在Android环境中创建功能丰富的日历应用...

    js版简易日历

    用js动态生成日历位置,闭包控制点击后出现的时间。

    C++简单日历

    在本文中,我们将深入探讨如何使用C++编程语言创建一个简单的日历程序。C++是一种通用的、面向对象的编程语言,它具有高效性、灵活性和丰富的库支持,非常适合进行这种类型的应用开发。 首先,我们需要了解日历的...

    web前端---JS简易日历

    在这个项目中,我们关注的是一个“JS简易日历”,它利用JavaScript语言来创建一个视觉上吸引人的、功能简单的日历组件。JavaScript,作为Web开发中的主要脚本语言,允许我们在不刷新页面的情况下动态更新内容,从而...

Global site tag (gtag.js) - Google Analytics