1
2
3
4
5
6
7
8
9
10
11

任务7.1 在网页中显示当前日期和问候语

发布时间:2017-09-24 15:15   发布人:唐海和   浏览次数:2778

                                  在网页中显示当前日期

                                     在网页中显示问候语

【任务7-1】在网页中显示当前日期和问候语

【任务描述】

 在网页文档0701.html中的合适位置编写javascript代码实现以下功能:

(1)在网页文档0701.html的顶部显示当前日期及星期数,日期格式为:年-月-日-星期。

(2)在网页文档0701.html顶部当前日期及星期数的右侧根据不同时间段(采用24小时制)显示相应的问候语。

(3)关闭网页0701.html时自动弹出对话框。

            网页0701.html的浏览效果如下图所示。

图片1.png

【任务实施】

1.编写javascript代码在网页中显示当前日期

   打开网页文档0701.html,在网页头部输入下面所示的javascript代码。

<script language="javasript" type="text/javascript">

<!--

 

  function openWin(msg) 

  { 

     alert(msg);

  }

  

  function dateweek() {

      var currentDate,thisDate,thisMonth,thisYear ;

      currentDate=new Date();

      thisDate=currentDate.getDate();

      thisMonth=currentDate.getMonth() 1;

      thisYear=currentDate.getYear();

      var weekArray=new Array(6);

      weekArray[0]="星期日";

      weekArray[1]="星期一";

      weekArray[2]="星期二";

      weekArray[3]="星期三";

      weekArray[4]="星期四";

      weekArray[5]="星期五";

      weekArray[6]="星期六";

      thisWeek=weekArray[currentDate.getDay()];

      document.write("今天是:" thisYear "年" thisMonth "月" thisDate "日" "  " thisWeek);

  }

 

//--> 

</script>

   在网页0701.html主体部分的合适位置

   输入HTML代码<script type=text/javascript> dateweek()</script>,调用自定义函数dateweek(),显示当前日期。

2.编写javascript代码在网页中显示问候语

   在网页的【代码】视图中,将光标置于显示当前日期的javascript代码之后,然后输入下面的javascript代码。

 <script language="javascript" type="text/javascript">

                <!--

                var today , hour ;

                today = new Date(),hour = today.getHours() ;

                if(hour < 12){document.write("&nbsp;上午好!") ;}

                else 

                    if (hour < 14){document.write("&nbsp;中午好!") ;}

                    else 

                        if (hour < 17){document.write("&nbsp;下午好!") ;}

                        else          {document.write("&nbsp;晚上好!") ;}

                // -->

               </script>

3.编写javascript代码实现关闭网页时自动弹出对话框

   在网页0701.html的头部的输入下面所示的javascript代码。

<body onUnload="openWin('感谢你光临本网站')">

4.分析具有类似功能的javascript代码的作用与含义

   第一步也是显示当前日期的javascript代码,请分析这些代码的作用与含义,应用了哪些javascript知识。



  • 张传坤 2017-09-28 10:20:37
    老师讲的清晰易懂,非常喜欢
  • 韩燕洁 2017-09-28 10:21:13
    很喜欢听老师讲课,有耐心并且老师很好
  • 王家敏 2017-09-28 10:22:01
    学会了,老师讲的不错
  • 徐勤翰 2017-09-28 10:22:45
    老师讲课很细致
  • 杨永吉 2017-09-28 10:24:58
    讲课生动形象,容易理解,棒棒哒