简单的js日历代码（js制作年历代码）

本篇文章给大家谈谈简单的js日历代码，以及js制作年历代码对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、javascript html实现网页版日历代码
• 2、js编写一个显示程序运行当天到下一个元旦之间的天数。
• 3、如何用JS写一个日历
• 4、ASP+JS日历源代码

javascript html实现网页版日历代码

本文实例为大家分享了网页版日历代码，供大家参考，具体内容如下

效果图：

实现代码：

html

head

link

rel="stylesheet"

type="text/css"

href="Skin.css"

style

!--

table{

text-align:

center

}

--

/style

/head

body

div

align="center"

script

language="javascript"

var

my

=

new

Date();

function

showc()

{

var

k=1;

var

j=1;

var

today;

var

tomonth;

var

theday=1;//日期

var

max;

var

temp;

var

tempday;//这个月第一天的星期

document.write

("b"

+

my.getFullYear()

+

"-"

+

(my.getMonth()+1)

+

"/b");

document.write

("table

border='1'

width='273'

height='158'");

document.write

("tr");

document.write

("td

height='23'

width='39'font

color='red'Sun/font/td");

document.write

("td

height='23'

width='39'Mon/td");

document.write

("td

height='23'

width='39'Tue/td");

document.write

("td

height='23'

width='39'Wed/td");

document.write

("td

height='23'

width='39'Thu/td");

document.write

("td

height='23'

width='39'Fri/td");

document.write

("td

height='23'

width='39'Sat/td");

document.write

("/tr");

temp=my.getDate();

my.setDate(1);

//document.write

(my.getDate());

tempday=my.getDay();//返回第一天是星期几

my.setDate(temp);

today=my.getDay();//返回现在星期几

switch

((my.getMonth()+1))

{

case

1:

case

3:

case

5:

case

7:

case

8:

case

10:

case

12:

max=31;

break;

case

4:

case

6:

case

9:

case

11:

max=30;

break;

default:

max=29;//这里没有考虑闰月！！

//document.write

(max);

}

for(k=0;k6;k++)

{

document.write

("tr");

for(j=0;j=6;j++)

{

document.write

("td

height='23'

width='39'");

if(j=(tempday))

{

tempday=0;//设置为最小，相当于取消判断条件

if(theday=max)

{

document.write

("a

title="

+

my.getFullYear()

+

"-"

+

(my.getMonth()+1)

+

"-"

+theday

+

"

target='_blank'

href=detail.asp?date="

+

theday

+

"");

if(theday==my.getDate())

document.write

("font

color='green'["

+

theday

+

"]/font/a");

else

if(j==0)

document.write

("font

color='red'"

+

theday

+

"/font/a");

else

document.write

(theday

+

"/a");

theday++;

}

}

document.write

("/td");

}

document.write

("/tr");

}

document.write

("/table");

}

showc();

/script

/div

body

/html

以上就是本文的全部内容，希望大家可以轻松实现网页版日历。

js编写一个显示程序运行当天到下一个元旦之间的天数。

下面小编就为大家带来一篇js编写当天简单日历效果【实现代码】。小编觉得挺不错的，现在分享给大家，也给大家做个参考

之前一直很想用javascript写一个日历，但是因为完全没有好的思路， 所以迟迟没有尝试。最近在网上刚好看到用javascript编写的简单日历的例子，代码量虽然不大， 但是我觉得很好地阐述了js日历的实现原理。自己也尝试着做了一下，收获蛮大，掌握了基本的实现原理后，再想增加更多的功能，完全就可以自由发挥了，先在这里分享一下吧，有兴趣的可以试试！

一.表格行数问题

既然要显示日期表格的话，首先得知道这个表格有多少行多少列，列数是已经确定的，从星期天（日历上第1列是星期天）到星期六一共7列。要解决行数问题之前，还得先知道这个月的第1天是星期几，因为每个月的1号并不都是从日历上的星期天开始排的，可能1号是星期五，星期六也说不定，所以1号的左边部分，就得用空表格代替了。那么用多少个空表格代替呢，这里就得用到getDay()方法了，该方法返回数组[0-6]中的一个数字，0代表星期天，1代表星期一，2代表星期二，以此类推。所以如果一个月的1号是星期五的话，那么刚好左边需要5个空表格代替。然后，假如一个月有31天，最后求出的表格行数就是：

var tr_nums = Math.ceil((5 + 31)/7); 

当然，并不是每个月都是31天，所以我们得创建一个包含12个月份的数组，每个元素代表每个月份所包含的天数。但是2月份比较特殊，闰年的2月份有29天，平年的2月份只有28天。所以，在创建数组之前，得自己创建一个判断闰年的函数:

//如果当前年份能被4整除但是不能被100整除或者能被400整除，即可确定为闰年，返回1，否则返回0

function isLeap(year) {

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

如何用JS写一个日历

首先必须解决的问题是表格的行与列问题。列是固定的，七列，因为一周有七天。行需要动态计算，因为，每一个月的第一天是星期几是一个变数，因而第一天在表格中的第几个单元也就跟着变化，同时，每个月的总天数不一致也影响着各个月对表格行数的需要量。

一.

表格的行数问题

1.首先取得处理月的总天数

JS不提供此参数，我们需要计算。考虑到闰年问题会影响二月份的天数，我们先编写一个判断闰年的自编函数：

function

is_leap(year)

{

return

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

}

接着定义一个包含十二个月在内的月份总天数的数组：

m_days=new

Array(31,28+is_leap(ynow),31,30,31,31,30,31,30,31,30,31);

m_days这个数组里，二月份的天数已经加入闰年的信息：28+is_leap(ynow)。数组元素从0开始，正好对应于JS提供的Date函数提供的getMonth返回值，即0表示一月，1表示二月，2表示三月，依此类推。

这样，各月总数可以这样取得：m_days[x]。其中，x为0至11的自然数。

2.计算处理月第一天是星期几

可以使用Date函数的getDay取得，返回的值从0到6，0表示星期一，1表示星期二，2表示星期三，其余依此类推。代码如下（假设要处理的时间为2008年3月）：

n1str=new

Date(2008,3,1);

firstday=n1str.getDay();

有了月总天数和该月第一天是星期几这两个已知条件，就可以解决表格所需行数问题：（当前月天数+第一天是星期几的数值）除以七。表格函数需要整数，因此，我们使用Math.ceil来处理：

tr_str=Math.ceil((m_days[mnow]

+

firstday)/7);

表格中的tr标签实际上代表表格的行，因此变量tr_str是我们往下写表格的重要依据。

二.

打印日历表格

可以使用两个for语句嵌套起来实现：外层for语句写行，内层for语句写单元格。

for(i=0;itr_str;i++)

{

//外层for语句

-

tr标签

document.write("tr");

for(k=0;k7;k++)

{

//内层for语句

-

td标签

idx=i*7+k;

//表格单元的自然序号

date_str=idx-firstday+1;

//计算日期

//这里是处理有效日期代码

}

//内层for语句结束

document.write("/tr");

}

//外层for语句结束

单元格的自然序号是否代表有效日期非常关键，为此必须加入一个过滤机制：仅打印有效的日期。有效的日期大于0小于小于等于处理月的总天数。

ASP+JS日历源代码

直接保存成 asp文件 运行就可以

html

head

meta http-equiv="Content-Type" content="text/html; charset=gb2312" /

link href="" rel="schema.DC" /

title日历/title

/head

body bgcolor="#FFFFFF"

%

' 要调用的函数声明

'根据年份及月份得到每月的总天数

Function GetDaysInMonth(iMonth, iYear)

Select Case iMonth

Case 1, 3, 5, 7, 8, 10, 12

GetDaysInMonth = 31

Case 4, 6, 9, 11

GetDaysInMonth = 30

Case 2

If IsDate("February 29, " iYear) Then

GetDaysInMonth = 29

Else

GetDaysInMonth = 28

End If

End Select

End Function

'得到一个月开始的日期.

Function GetWeekdayMonthStartsOn(dAnyDayInTheMonth)

Dim dTemp

dTemp = DateAdd("d", -(Day(dAnyDayInTheMonth) - 1), dAnyDayInTheMonth)

GetWeekdayMonthStartsOn = WeekDay(dTemp)

End Function

'得到当前一个月的上一个月.

Function SubtractOneMonth(dDate)

SubtractOneMonth = DateAdd("m", -1, dDate)

End Function

'得到当前一个月的下一个月.

Function AddOneMonth(dDate)

AddOneMonth = DateAdd("m", 1, dDate)

End Function

' 函数声明结束

Dim dDate ' 日历显示的日期

Dim iDOW ' 每一月开始的日期

Dim iCurrent ' 当前日期

Dim iPosition ' 表格中的当前位置

' 得到选择的日期并检查日期的合法性

If IsDate(Request.QueryString("date")) Then

dDate = CDate(Request.QueryString("date"))

Else

If IsDate(Request.QueryString("month") "-" Request.QueryString("day") "-" Request.QueryString("year")) Then

dDate = CDate(Request.QueryString("month") "-" Request.QueryString("day") "-" Request.QueryString("year"))

Else

dDate = Date()

If Len(Request.QueryString("month")) 0 Or Len(Request.QueryString("day")) 0 Or Len(Request.QueryString("year")) 0 Or Len(Request.QueryString("date")) 0 Then

Response.Write "您所选择的日期格式不正确，系统会使用当前日期.BRBR"

End If

End If

End If

'得到日期后我们先得到这个月的天数及这个月的起始日期.

iDIM = GetDaysInMonth(Month(dDate), Year(dDate))

iDOW = GetWeekdayMonthStartsOn(dDate)

%

table width="180" height="100%" border="0" cellpadding="0" cellspacing="0"

tr

tdtable width="150" border="0" align="center" cellpadding="0" cellspacing="0"

tr

td height="5" /td

/tr

/table

table width="180" border="0" align="center" cellpadding="0" cellspacing="0"

tr

td align="center" colspan="7"table border="0" cellpadding="0" cellspacing="0"width="100%"

tr

td height="22" align="right"a href="rl.asp?date=%= SubtractOneMonth(dDate) %"img src="../images/dot_left.gif" width="15" height="14" border="0" //a/td

td align="center"font color="999999"b%= MonthName(Month(dDate)) " " Year(dDate) %/b/font/td

tda href="rl.asp?date=%= AddOneMonth(dDate) %"img src="../images/dot_right.gif" width="15" height="14" border="0" //a/td

/tr

/table/td

/tr

tr

td width="25" height="22" align="center"font

color="d08c00"b日/b/font /td

td width="25" align="center"bfont color="999999"一/font/b /td

td width="25" align="center"bfont color="999999"二/font/b /td

td width="25" align="center"bfont color="999999"三/font/b /td

td width="25" align="center"bfont color="999999"四/font/b /td

td width="25" align="center"bfont color="999999"五/font/b /td

td width="25" align="center"bfont color="d08c00"六/font/b /td

/tr

%

' 如果这个月的起始日期不是周日的话就加空的单元.

If iDOW 1 Then

Response.Write vbTab "TR" vbCrLf

iPosition = 1

Do While iPosition iDOW

Response.Write vbTab vbTab "TD /TD" vbCrLf

iPosition = iPosition + 1

Loop

End If

' 绘制这个月的日历

iCurrent = 1

iPosition = iDOW

Do While iCurrent = iDIM

' 如果是一行的开头就使用 TR 标记

If iPosition = 1 Then

Response.Write vbTab "TR" vbCrLf

End If

' 如果这一天是我们选择的日期就高亮度显示该日期.

If iCurrent = Day(dDate) Then

Response.Write vbTab vbTab "TD BGCOLOR=#eeeeee height=18 align=centerB" iCurrent "/B/TD" vbCrLf

Else

Response.Write vbTab vbTab "TD height=18 align=centerA HREF=""./rl.asp?date=" Month(dDate) "-" iCurrent "-" Year(dDate) """" iCurrent "/A/TD" vbCrLf

End If

' 如果满一周的话表格就另起一行

If iPosition = 7 Then

Response.Write vbTab "/TR" vbCrLf

iPosition = 0

End If

iCurrent = iCurrent + 1

iPosition = iPosition + 1

Loop

' 如果一个月不是以周六结束则加上相应的空单元.

If iPosition 1 Then

Do While iPosition = 7

Response.Write vbTab vbTab "TD /TD" vbCrLf

iPosition = iPosition + 1

Loop

Response.Write vbTab "/TR" vbCrLf

End If

%

/table

table width="150" border="0" align="center" cellpadding="0" cellspacing="0"

tr

td height="5" /td

/tr

/table/td

/tr

/table

简单的js日历代码的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于js制作年历代码、简单的js日历代码的信息别忘了在本站进行查找喔。