JavaScript程序.docx

varsec=0;varmin=0;varhou=0;flag=0;

window.setTimeout（"update（）;",1000）;//每隔1秒更新时间

functionupdate（）//实现更新的主要方法

{sec++;//秒数自增

if（sec==60）

{sec=0;min+=1;}//如果秒数超过60,分钟数就自增

if（min==60）

{min=0;hou+=1;}//如果分钟数超过60,小时数就自增

if（（min>0）&&（flag==0））

{window.alert（"您停留了1分钟,欢迎再来!

"）;

flag=1;

}

document.forms.input1.value=hou+"时"+min+"分"+sec+"秒";//在文本框中输出时间

window.setTimeout（"update（）;",1000）;//定时更新时间，每隔一秒更新一次

}

【难点剖析】

本例的重点其实是“setTimeout”计时器。

为了实现时间不断变化，必须使用“setTimeout”不断调用“update”方法。

将定时时间设置为“1000”会每一秒更新一次显示的文本。

7）检测是否是闰年

【实例描述】

在判断日期时需要注意闰年的二月份天数为29天，非闰年为28天。

本例学习一个判断闰年的方法。

functioncheckYear（year）

{//判断是否能被4整除且不能被100整除，还有一个是能被400整除-闰年的标准

return（（（year%4==0）&&（year%100!

=0））||（year%400==0））?

1:

0;

}

functionJudge（form）

{year=form.year.value;

varCheck1=parseFloat（year）;//获取由字符串转换成的浮点数

for（vari=0;i

{varsLetterCheck1=year.substring（i,i+1）;

if（sLetterCheck1<"0"||sLetterCheck1>"9"）

{alert（"请输入一个有效的年份"）;

form.year.focus（）;

form.year.select（）;

return;

}

}

if（year<1582）

{form.result.value="";

alert（"对不起，你输入的年份必须大于1581."）;

form.year.focus（）;

form.year.select（）;

return;

}

checkYear（year）;//判断年份是否是闰年

if（!

checkYear（year））form.result.value="不是闰年";

elseform.result.value="是闰年";

}

【难点剖析】

本例的重点是闰年的判断标准。

判断一个年份是否闰年，一是判断其是否能被4整除，同时还不能被100整除（如2100就不是闰年）；二是判断此年份是否能被400整除，如果能则一定是闰年。

8）计算用户浏览网页的时间

【实例描述】

当用户离开网页时，可以计算用户在该网页的停留时间，并以alert的方式进行提醒。

注意是在某网页的停留时间，而不是某网站。

【实现代码】

pageOpenTime=newDate（）;//定义打开网页的时间

functiongoodbye（）

{pageCloseTime=newDate（）;//定义关闭网页的时间

minutes=（pageCloseTime.getMinutes（）-pageOpenTime.getMinutes（））;

seconds=（pageCloseTime.getSeconds（）-pageOpenTime.getSeconds（））;

time=（seconds+（minutes*60））;

alert（'总共停留了'+time+'秒,一路走好!

'）;

}

当用户离开的时候，需要调用上面的“goodbye”方法，所以为body指定“onunload”事件，代码如下所示：

【难点剖析】

读取系统日期和时间的是Date对象，当用户打开网页时，使用Date获取打开时间，用户关闭网页时，调用方法“goodbye”获取关闭时间，然后将分钟数换算为秒数，计算两个时间的间隔，最后用“alert”方法提醒用户。

9）记录页面的修改时间

【实例描述】

为了让用户知道网站的内容是否更新，可在首页上提示页面的更新时间。

【实现代码】

document.write（"本页面最后更新的时间是:

"+document.lastModified+""）

【难点剖析】

本例的重点是Document对象的“lastModified”属性，其用来获取当前页面的最后更新时间。

使用Document对象可以获取文档的一些相关属性，如创建时间、页面大小等。

10）随日期变换的文本

【实例描述】

网站的首页通常需要显示当前的日期，为了提醒用户，可在日期后面显示一些相关信息，如“4月11日排队日”。

因为一个月最多有31天，所以可以使用数组来保存这些对应天数的信息。

【实现代码】

vartoday=newDate（）;//获取当前日期

varmonth=today.getMonth（）+1;//获取月

vardate=today.getDate（）;//获取日

varyear=today.getYear（）;//获取年

notes=newArray;

notes[1]="1号的信息";notes[2]="2号的信息";

notes[3]="3号的信息";notes[4]="4号的信息";

notes[5]="5号的信息";notes[6]="6号的信息";

notes[7]="7号的信息";notes[8]="8号的信息";

notes[9]="9号的信息";notes[10]="10号的信息";

notes[11]="文明排队日";notes[12]="12号的信息";

notes[13]="13号的信息";notes[14]="14号的信息"

notes[15]="15号的信息";notes[16]="16号的信息";

notes[17]="17号的信息";notes[18]="18号的信息";

notes[19]="19号的信息";notes[20]="20号的信息";

notes[21]="21号的信息";notes[22]="无车日";

notes[23]="23号的信息";notes[24]="24号的信息";

notes[25]="25号的信息";notes[26]="26号的信息";

notes[27]="27号的信息";notes[28]="28号的信息";

notes[29]="29号的信息";notes[30]="30号的信息";

notes[31]="31号的信息";

vartodayMsg=notes[date];//获取要显示的信息

然后在body元素内调用如下所示的代码即可实现日期和信息的显示。

document.write（today）;document.write（todayMsg）

【难点剖析】

日期（Date）和数组（Array）是两个常用JavaScript对象，使用“new”关键字创建。

读取数组时需使用索引，如“notes[date]”。

11）页面访问时间限制

【实例描述】

有些页面设置了访问时间，要求用户在指定的时间内保存页面。

本例学习如何实现这种功能。

【实现代码】

varlimit="1:

02";//设置剩余的时间

vartmpTime=limit.split（":

"）;//将分和秒切割开

varmyTime=tmpTime[0]*60+tmpTime[1]*1;//获取剩余的秒数

functioncalTime（）

{if（myTime==1）

window.location=""//时间到了后导航到的地址

else

{myTime-=1;//开始倒数时间

curmin=Math.floor（myTime/60）;//当前剩余分钟数

cursec=myTime;//当前剩余秒数

if（curmin!

=0）//如果分钟数不为0

curtime="你只有"+curmin+"分钟的时间保存此页。

";

else

curtime="你只有"+cursec+"秒的时间访问此页，请尽快保存。

";

setTimeout（"calTime（）",1000）;//设置定时器，不断变化提示时间

document.form1.txttime.value=curtime;//在文本框中显示剩余时间

}

}

【难点剖析】

本例的重点是秒数的计算。

如果设置的剩余时间中有分钟数，需要先将分钟数转换为秒数。

在代码中的“varmyTime=tmpTime[0]*60+tmpTime[1]*1”处要注意，虽然“tmpTime[1]*1”和“tmpTime[1]”计算结果一样，但为了保持变量类型一致，还需要使用“tmpTime[1]*1”。

“Math.floor（myTime/60）”用来判断是否还有分钟数。

12）标题栏显示时间

【实例描述】

标题栏一般显示网站名称或网页名称。

本例通过时间和标题栏的调用，实现在标题栏显示时间的特效。

【实现代码】

varclocktext;

varpagetitle=document.title;//获取页面标题

functionviewTime（）

{today=newDate（）;//获取当前日期

sec=today.getSeconds（）;//获取秒

hr=today.getHours（）;//获取小时

min=today.getMinutes（）;//获取分钟

if（hr<=9）hr="0"+hr;//显示两位的小时

if（min<=9）min="0"+min;//显示两位的分钟

if（sec<=