原创力文档- 1、本文档共5页，可阅读全部内容。
- 2、原创力文档（book118）网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
- 3、本站所有内容均由合作方或网友上传，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务；查看《如何避免下载的几个坑》。如果您已付费下载过本站文档，您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“版权申诉”（推荐），也可以打举报电话：400-050-0827(电话支持时间：9:00-18:30)。
- 5、该文档为VIP文档，如果想要下载，成为VIP会员后，下载免费。
- 6、成为VIP后，下载本文档将扣除1次下载权益。下载后，不支持退款、换文档。如有疑问请联系我们。
- 7、成为VIP后，您将拥有八大权益，权益包括：VIP文档下载权益、阅读免打扰、文档格式转换、高级专利检索、专属身份标志、高级客服、多端互通、版权登记。
- 8、VIP文档为合作方或网友上传，每下载1次， 网站将根据用户上传文档的质量评分、类型等，对文档贡献者给予高额补贴、流量扶持。如果你也想贡献VIP文档。上传文档
查看更多
教学项目二十一 JavaScript中Date对象及其应用
【教学内容】
讲解JavaScript中的内置 Date对象
【教学目的】
使学生学会设计与时间相关的JavaScript特效网页
【教学重点】
内置对象Date的使用
【教学难点】
内置对象Date的使用
【教学方式】
讨论式、案例分析式、练习式相结合
【教学参考】
1．<<JavaScript 入门与提高>> 杨浩著 清华大学出版社
2．<<Internet 网页工场>> Wittime工作室 重庆出版社
3．<<JavaScript从入门到精通>> 电脑报社出版
4．<<JavaScript编程起步>> 人民邮电出版社
【教学过程】
【新课】
案例设计
设计倒记时网页：
分析：
此例中处理的是与时间相关的信息，要用到Date()对象；
getTime(): 获取当前时间以毫秒作为计数单位的数值；
程序代码如下：
<html>
<body>
<script>
var tim=new Date("01/01/2005");
var s="今天距离2005年1月1日";
var now=new Date();
var ile=tim.getTime()-now.getTime();
var day1=Math.floor(ile/(1000*60*60*24));
document.write(" "+s+"还有"+day1+"天");
</script>
</body>
</html>
案例二、设计分时显示不同信息的网页。
分析：
将时间分成不同时段：
4： 显示信息夜深了，请将喇叭的音量调小
4—7： 显示信息清晨好，您可真早呀!早饭吃了吗?
7—12： 显示信息上午好，您开始工作了？
12—18：显示信息下午好，工作时间可别光顾着上网啊！
18—23：显示信息晚上好，正是上网的好时机!
程序代码如下：
<html>
<body>
<script language="JavaScript">
<!--
var mess1=" ";
document.write("<center><font color='#000000' >")
day = new Date( )
hr = day.getHours( )
if (( hr >=0 ) && (hr <= 4 ))
mess1= "夜深了，请将喇叭的音量调小"
if (( hr >= 4 ) && (hr < 7))
mess1=" 清晨好，您可真早呀!早饭吃了吗?"
if (( hr >= 7 ) && (hr < 12))
mess1=" 上午好，您开始工作了？ "
if (( hr >= 12) && (hr <= 18))
mess1= "下午好，工作时间可别光顾着上网啊！ "
if ((hr >= 18) && (hr <= 23))
mess1= "晚上好，正是上网的好时机! "
document.write(mess1);
</script>
</body>
</html>
案例三、设计网页， 将系统时间显示在按钮上。
分析：
使用Date()对象的getHour()、 getMInutes()、 getSeconds()方法
getHour()： 获取小时值；
getMInutes()：获取当前分钟值；
getSeconds()：获取当前秒钟值；
将显示时间的功能设计为函数clock()
程序代码如下：
<html>
<head>
<script LANGUAGE="JavaScript">
function clock()
{
today = new Date();
hrNow = today.getHours();
mnNow = today.getMinutes();
scNow = today.getSeconds();
if(hrNow <= 11)
{
ap = " AM";
hour = hrNow;
}
else
if (hrNow >= 12) {
hour = (hrNow - 12);
ap = " PM";
}
if (mnNow <= 9) {
min = "0" + mnNow;
}
else
{
(min = mnNow)
}
if (scNow <= 9)
{
secs = "0" + scNow;
}
else {
secs = scNow;
}
time ="现在时间是："+ hour + ":" + min + ":" + secs + ap;
document.form1.button1.value = tim
文档评论（0）