版權說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權，請進行舉報或認領
文檔簡介
第11章綜合實訓JavaScript是Web頁面中的一種腳本編程語言，也是一種通用的、跨平臺的、基于對象和事件驅動并具有安全性的腳本語言。它不需要進行編譯，而是直接嵌入在HTML頁面中，把靜態(tài)頁面轉變成支持用戶交互并響應相應事件的動態(tài)頁面。通過前面10章的學習，相信讀者已經(jīng)對JavaScript有了深刻的認識和掌握。本章將通過10個實例來綜合運用和擴展前面的知識，使讀者進一步掌握所學知識。課件制作人：√本章目錄實訓1JavaScript基本操作
實訓2HTML文檔基本操作
實訓3JavaScript語言基礎操作
實訓4JavaScript基本語句的應用
實訓5函數(shù)的應用
實訓6對象編程的操作
實訓7事件處理的操作
實訓8瀏覽器對象的應用
實訓8瀏覽器對象的應用
實訓10Ajax技術的應用
√√√√√√√√√課件制作人：實訓1JavaScript基本操作（1）熟練掌握HTML文件中編寫JavaScript程序的基本操作。（2）基本掌握Dreamweaver編寫工具?！緦嵱柲康摹?/p>
課件制作人：實訓1JavaScript基本操作編寫一個JavaScript程序，實現(xiàn)在頁面上輸出“歡迎訪問明日公司主頁”，效果如圖11.1所示?！緦嵱杻?nèi)容】
課件制作人：實訓1JavaScript基本操作（1）打開Dreamweaver，在“創(chuàng)建新項目”列中選擇“HTML”。（2）自動創(chuàng)建HTML模板，將<title>…</title>標記間的內(nèi)容改為“歡迎頁”。（3）在<body>…</body>標記間編寫如下代碼，實現(xiàn)在頁面上輸出“歡迎訪問明日公司主頁”。<scriptlanguage="javascript">document.write("<HR>");document.write("<h1>歡迎訪問明日公司主頁</h1>");document.write("<HR>");</script>（4）選擇“文件”/“在瀏覽器中預覽”/“IExplore6.0”，預覽網(wǎng)頁?！緦嵱柌襟E】
課件制作人：實訓2HTML文檔基本操作（1）熟練掌握HTML文檔中的常用標記。（2）熟練應用框架進行網(wǎng)頁布局?！緦嵱柲康摹?/p>
課件制作人：實訓2HTML文檔基本操作（1）應用HTML文檔中的常用標記制作一個在線音樂網(wǎng)站主頁，要求主頁應用框架實現(xiàn)。（2）在各個子頁應用HTML文檔中的表格標記，段落標記、文字標記、列表標記和圖像標記等來顯示個人網(wǎng)站的LOGO，圖像，音樂歌詞等相關信息。（3）單擊主頁歌名超級鏈接時，顯示歌詞信息，并將歌詞顯示在指定的框架頁。（4）在線音樂網(wǎng)主頁頁面美觀大方，以不同大小、不同顏色、不同樣式和不同格式的網(wǎng)頁信息展現(xiàn)給讀者。效果如圖11.2所示。【實訓內(nèi)容】
課件制作人：實訓2HTML文檔基本操作（1）打開Dreamweaver，在“創(chuàng)建新項目”列中選擇“HTML”。（2）自動創(chuàng)建HTML模板，將文件保存為index.html。（3）在index.html頁中應用框架標記實現(xiàn)在音樂網(wǎng)主頁的基本框架結構?？蚣茼摲謩e保存為top.html、left.html、main.html和bottom.html，效果如圖11.3所示?！緦嵱柌襟E】
課件制作人：實訓2HTML文檔基本操作首頁index.html實現(xiàn)框架的完整代碼如下。<html><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>在線音樂網(wǎng)</title></head><framesetrows="220,*"frameborder="no"border="0"framespacing="0"><framesrc="top.html"name="topFrame"scrolling="No"noresize="noresize"id="topFrame"/><framesetrows="*,159"cols="*"framespacing="0"frameborder="no"border="0"> <framesetrows="*"cols="430,*"framespacing="0"frameborder="no"border="0"> <framesrc="left.html"name="leftFrame"scrolling="No"noresize="noresize"id="leftFrame"/> <framesrc="main.html"name="mainFrame"id="mainFrame"/> </frameset> <framesrc="bottom.html"name="bottomFrame"scrolling="No"noresize="noresize"id="bottomFrame"/></frameset></frameset><noframes><bodybgcolor="#CCFF33"></body></noframes></html>【實訓步驟】
課件制作人：實訓2HTML文檔基本操作（4）在top.html頁中應用圖像標記<img>調用在線音樂網(wǎng)的Banner廣告，代碼如下。<tablewidth="800"border="0"align="center"cellpadding="0"cellspacing="0"><tr><tdalign="center"><imgsrc="images/bg.JPG"width="768"height="220"/></td></tr></table>（5）在bottom頁中應用表格標記<table>、換行標記<br>輸出版權信息，代碼如下。<tablewidth="800"border="0"align="center"cellpadding="0"cellspacing="0"><tr><tdheight="70"align="center"bgcolor="#FFCC33">我行我秀 在線音樂網(wǎng) <br/><br/>
本站請使用IE6.0或以上版本1024*768為最佳分辨率</td></tr></table>【實訓步驟】
課件制作人：實訓2HTML文檔基本操作（6）在左側導航頁left.html頁中，應用標題標記、列表標記和超鏈接標記等實現(xiàn)歌曲名稱超級鏈接。<tablewidth="180"border="0"align="right"cellpadding="0"cellspacing="0"><tr><tdwidth="206"height="507"valign="top"bgcolor="#FFFFCC"> <br><br> <h4> 最新主打歌</h4> <ultype="circle"> <li><ahref="music.html"target="mainFrame">小草</a></li> <li><ahref="music.html"target="mainFrame">你是我的天使</a></li> <li><ahref="music.html"target="mainFrame">我的愛人</a></li> <li><ahref="music.html"target="mainFrame">緣沒了愛依舊</a></li> <li><ahref="music.html"target="mainFrame">花兒謝了</a></li> <li><ahref="music.html"target="mainFrame">藍色玫瑰</a></li> <li><ahref="music.html"target="mainFrame">你是我傷口永遠的痛</a></li> </ul> <br><br> <h4> 經(jīng)典老歌</h4> <oltype="A"start="1"> <li><ahref="music.html"target="mainFrame">下輩子你會愛我嗎</a></li> <li><ahref="music.html"target="mainFrame">逃避你的眼神</a></li> <li><ahref="music.html"target="mainFrame">沒來由的愛</a></li> <li><ahref="music.html"target="mainFrame">一生情</a></li> <li><ahref="music.html"target="mainFrame">愛沒完沒了</a></li> <li><ahref="music.html"target="mainFrame">我是最幸福的人</a></li> <li><ahref="music.html"target="mainFrame">我的愛天作證</a></li> <li><ahref="music.html"target="mainFrame">你是我永遠的愛人</a></li> </ol> </td></tr></table>【實訓步驟】
課件制作人：實訓2HTML文檔基本操作為歌曲名稱添加文字超級鏈接，單擊歌曲名稱，打開歌詞鏈接文件music.html，并將music.html頁中的內(nèi)容顯示在名稱為“mainFrame”的框架內(nèi)。在歌詞信息頁music.html中，應用圖像標記顯示音樂圖標，應用表格標記、段落標記、換行標記等顯示歌詞信息，完整代碼如下。<tablewidth="600"border="0"align="left"cellpadding="0"cellspacing="0"><tr><tdheight="89"align="center"valign="top"bgcolor="#FFFFFF"><br/><br/><h2><imgsrc="images/music.JPG"width="298"height="70"/><br/><br/></h2></td></tr><tr><tdheight="249"align="center"valign="top"bgcolor="#FFFFFF"><pclass="STYLE1">寫信告訴我今天海是什么顏色<br/>
夜夜陪著你的海心情又如何<br/>……
為何你明明動了情卻又不靠近</p><pclass="STYLE1">聽?？薜穆曇?lt;br/>
嘆息著誰又被傷了心卻還不清醒<br/>……
說你在離開我的時候是怎樣的心情</td></tr></table>【實訓步驟】
課件制作人：實訓2HTML文檔基本操作（7）在信息主顯示頁main.html頁中，應用表格標記、段落標記、換行標記、標題標記等顯示歌詞信息。<tablewidth="600"border="0"align="left"cellpadding="0"cellspacing="0"><tr><tdheight="89"align="center"valign="top"bgcolor="#EFFBA5"><br/><br/><h2> ==== 音樂欣賞 ====</h2></td></tr><tr><tdheight="249"align="center"valign="top"bgcolor="#EFFBA5"><pclass="STYLE1">寫信告訴我今天海是什么顏色<br/>
夜夜陪著你的海心情又如何<br/>……
為何你明明動了情卻又不靠近</p><pclass="STYLE1">聽?？薜穆曇?lt;br/>
嘆息著誰又被傷了心卻還不清醒<br/>……
說你在離開我的時候是怎樣的心情<br/></td></tr></table>（8）選擇“文件”/“在瀏覽器中預覽”/“IExplore6.0”，預覽在線音樂網(wǎng)站，在主頁單擊歌曲名稱超級鏈接，在mainFrame框架內(nèi)顯示歌詞內(nèi)容?！緦嵱柌襟E】
課件制作人：實訓3JavaScript語言基礎操作（1）熟練掌握JavaScript常用的數(shù)據(jù)類型。（2）熟練掌握定義變量的方法，熟悉運算符和表達式的應用。（3）熟悉三目運算符的應用?！緦嵱柲康摹?/p>
課件制作人：實訓3JavaScript語言基礎操作編寫一個JavaScript程序，通過三目運算符來返回用戶輸入的年份是否為閏年，如圖11.4所示。【實訓內(nèi)容】
課件制作人：實訓3JavaScript語言基礎操作（1）打開Dreamweaver，在“創(chuàng)建新項目”列中選擇“HTML”。（2）自動創(chuàng)建HTML模板，將<title>…</title>標記間的內(nèi)容改為“判斷指定的年份是否為閏年”，將文件保存為index.html。（3）在<body>…</body>標記間編寫如下代碼，應用三目運算符編寫判斷指定年份是否為閏年的JavaScript代碼。<scriptlanguage="javascript">functionleapyear(){ varnow=newDate(); varyears=now.getFullYear(document.form1.txt_year.value); varstr; varyears=document.form1.txt_year.value; varresult=(years%4==0&&years%100!=0)||(years%400==0)?years+"是閏年":years+"不是閏年";
document.form1.txt_yearresult.value=result;}</script>【實訓步驟】
課件制作人：實訓3JavaScript語言基礎操作<formname="form1"method="post"action=""><tablewidth="392"height="101"border="1"align="center"cellpadding="1"cellspacing="1"bordercolor="#009900"bgcolor="#CCFF00"><tr><tdheight="25"colspan="2"align="center"class="STYLE5">判斷指定的年份是否為閏年</td></tr><tr><tdwidth="152"height="30"bgcolor="#FFFF99"><spanclass="STYLE3">請輸入一個四位數(shù)的年份：</span></td><tdwidth="216"bgcolor="#FFFF99"><tablewidth="196"height="29"border="0"cellpadding="0"cellspacing="0"><tr><tdwidth="136"><inputname="txt_year"type="text"value="2009"size="20"></td><tdwidth="60"> <inputtype="button"name="Button"value="計算"onClick="leapyear();"></td></tr></table></td></tr><tr><tdheight="37"colspan="2"align="center"><inputname="txt_yearresult"type="text"value=""size="51"></td></tr></table>（4）選擇“文件”/“在瀏覽器中預覽”/“IExplore6.0”，預覽網(wǎng)頁，在文本框中輸入4位數(shù)的年份，單擊“計算”按鈕，判斷指定的年份是否為閏年。
【實訓步驟】
課件制作人：實訓4JavaScript基本語句的應用熟練掌握JavaScript中if條件語句和for循環(huán)語句的應用?！緦嵱柲康摹?/p>
課件制作人：實訓4JavaScript基本語句的應用編寫一個JavaScript程序，應用JavaScript腳本中的if語句和for循環(huán)語句實現(xiàn)復選框的全選和反選。單擊“全選/”復選框可以實現(xiàn)快速選擇當前頁的所有用戶信息；當“全選/反選”復選框處于選中狀態(tài)時，再次單擊“全選/”復選框可以實現(xiàn)快速在原有用戶選擇的狀態(tài)進行反項選擇，效果如圖11.5、圖11.6所示?！緦嵱杻?nèi)容】
課件制作人：實訓4JavaScript基本語句的應用（1）打開Dreamweaver，在“創(chuàng)建新項目”列中選擇“HTML”。（2）自動創(chuàng)建HTML模板，將<title>…</title>標記間的內(nèi)容改為“應用if語句和for循環(huán)語句實現(xiàn)復選框的全選和反選”，將文件保存為index.html。（3）在<head>…</head>標記間編寫JavaScript腳本。應用if語句和for循環(huán)語句實現(xiàn)復選框的全選和反選。<scriptlanguage="javascript">functionCheckAll(elementsA,elementsB){ varlen=elementsA; if(len.length>0){ for(i=0;i<len.length;i++){ elementsA[i].checked=true; } if(elementsB.checked==false){ for(j=0;j<len.length;j++){ elementsA[j].checked=false; } } } else{ len.checked=true; if(elementsB.checked==false){ len.checked=false; } }}</script>【實訓步驟】
課件制作人：實訓4JavaScript基本語句的應用（4）在<body>…</body>標記間添加用戶信息管理頁面表單元素的HTML代碼。<formname="deluser"method="post"><tablewidth="600"border="1"align="center"cellpadding="3"cellspacing="2"bordercolor="#FFFFFF"bordercolorlight="#FFFFFF"bordercolordark="#336699"bgcolor="#CCFF33"><tr> <tdwidth="7%"height="27"align="center"nowrapstyle="color:black;">選項</td><tdwidth="21%"height="27"align="center"nowrapstyle="color:black;">用戶名稱</td> <tdwidth="22%"height="27"align="center"nowrapstyle="color:black;">密碼</td> <tdwidth="30%"height="27"align="center"nowrapstyle="color:black;">注冊時間</td> </tr><tr><tdheight="27"align=centernowrapbgcolor="#FFFFCC"><inputtype="checkbox"name="ChkBox"value="130008100001"style="border:0;"> </td> <tdheight="27"align=centernowrapbgcolor="#FFFFCC"style="color:black;">純凈水</td> <tdheight="27"align=centernowrapbgcolor="#FFFFCC"style="color:black;">chunjingshui666</td> <tdheight="27"align=centernowrapbgcolor="#FFFFCC"style="color:black;">2008-11-14</td> </tr>【實訓步驟】
課件制作人：實訓4JavaScript基本語句的應用
<tr><tdheight="27"align=centernowrapbgcolor="#FFFFCC"><inputtype="checkbox"name="ChkBox"value="130008100008"style="border:0;"> </td>
<tdheight="27"align=centernowrapbgcolor="#FFFFCC"style="color:black;">小草</td>
<tdheight="27"align=centernowrapbgcolor="#FFFFCC"style="color:black;">xiaocao888</td>
<tdheight="27"align=centernowrapbgcolor="#FFFFCC"style="color:black;">2008-12-10</td></tr><tr><tdheight="27"align=centernowrapbgcolor="#FFFFCC"><inputtype="checkbox"name="ChkBox"value="130008100066"style="border:0;"> </td> <tdheight="27"align=centernowrapbgcolor="#FFFFCC"style="color:black;">城市中的狼</td> <tdheight="27"align=centernowrapbgcolor="#FFFFCC"style="color:black;">city12345</td> <tdheight="27"align=centernowrapbgcolor="#FFFFCC"style="color:black;">2009-2-6</td> </tr></table><tablewidth="600"border="0"cellspacing="0"cellpadding="0"align=center><tr><tdwidth="9%"height="40"align=centernowrap><inputname="Chkall"type="checkbox"style="border:0;"onClick="CheckAll(this.form.ChkBox,this.form.Chkall)"></td><tdwidth="91%"align=leftnowrapstyle="color:black;">[全選/反選]</td></tr></table></form>（5）選擇“文件”/“在瀏覽器中預覽”/“IExplore6.0”，預覽網(wǎng)頁?！緦嵱柌襟E】
課件制作人：實訓5函數(shù)的應用熟練應用JavaScript腳本進行自定義函數(shù)，并掌握函數(shù)的調用方法。【實訓目的】
課件制作人：實訓5函數(shù)的應用編寫一個JavaScript程序，調用自定義函數(shù)來限制發(fā)送祝福的文字數(shù)量，效果如圖11.7所示?！緦嵱杻?nèi)容】
課件制作人：實訓5函數(shù)的應用（1）打開Dreamweaver，在“創(chuàng)建新項目”列中選擇“HTML”。（2）自動創(chuàng)建HTML模板，將<title>…</title>標記間的內(nèi)容改為“調用自定義函數(shù)來限制發(fā)送祝福的文字數(shù)量”，將文件保存為index.html。（3）在<head>…</head>標記間編寫JavaScript腳本。實現(xiàn)用戶輸入文字信息字符數(shù)量的計算，其中，英文、數(shù)字、空格占1個字符，漢字占兩個字符。<scriptlanguage="javascript">functiontextCounter(field,countfield,maxlimit){ //文本信息限制在150個字符內(nèi)
varStrValue=field.value; varByteCount=0; varStrLength=field.value.length; for(i=0;i<StrLength;i++){ //計算輸入的字符個數(shù)，英文數(shù)字占1個字符，漢字占兩個字符
ByteCount=(StrValue.charCodeAt(i)<=256)?ByteCount+1:ByteCount+2; }
if(ByteCount<=maxlimit){ strtemp=StrValue; countfield.value=maxlimit-ByteCount; }else{ document.getElementById('content').innerHTML=strtemp; }}</script>【實訓步驟】
課件制作人：實訓5函數(shù)的應用（4）在<body>…</body>標記間添加用戶信息管理頁面表單元素的HTML代碼。<formid="form1"name="form1"method="post"action="wishingadd_ok.php"><spanstyle="margin-left:22px">您還能輸入<inputstyle="BORDER-TOP-WIDTH:0px;BORDER-LEFT-WIDTH:0px;BORDER-BOTTOM-WIDTH:0px;BORDER-RIGHT-WIDTH:0px;color:#CC0099"readonly="readOnly"maxlength="3"size="3"value="150"name="freeLength"/>個字符的祝福信息，發(fā)送給你最想祝福的人吧！<br/><textareaname="content"id="content"cols="66"rows="6"onkeydown="textCounter(this.form.content,this.form.freeLength,150)"onkeyup="textCounter(this.form.content,this.form.freeLength,150)"style="background:url('images/mrbccd.gif')"></textarea></span></form>（5）選擇“文件”/“在瀏覽器中預覽”/“IExplore6.0”，預覽網(wǎng)頁?！緦嵱柌襟E】
課件制作人：實訓6對象編程的操作（1）熟練掌握JavaScript中對象的創(chuàng)建及使用。（2）熟練應用JavaScript中的日期對象、字符串對象、數(shù)學對象和數(shù)組對象。【實訓目的】
課件制作人：實訓6對象編程的操作編寫一個JavaScript程序，本實例主要應用日期對象、字符串對象、數(shù)學對象和數(shù)組對象來獲取指定日期的相關信息，并用Lunar對象將指定日期轉換成相應的農(nóng)歷日期。效果如圖11.8所示?！緦嵱杻?nèi)容】
課件制作人：實訓6對象編程的操作（1）打開Dreamweaver，在“創(chuàng)建新項目”列中選擇“HTML”。（2）自動創(chuàng)建HTML模板，將<title>…</title>標記間的內(nèi)容改為“帶農(nóng)歷的日歷”，將文件保存為index.html。（3）在頁面中添加一個表格，代碼如下：<CENTER><FORMname=CLD><TABLE><TR><TDalign=middle><TABLEborder=1cellpadding="0"cellspacing="0"bordercolordark="#FFFFFF"
bordercolor="#ffffff"bordercolorlight="#EEEEEE"><TRbgcolor="#006600"><TDcolSpan=7><FONTcolor=#ffffffstyle="FONT-SIZE:9pt">公歷<SELECTname=SYonchange=changeCld()style="FONT-SIZE:9pt">JavaScript代碼在Menu組件中動態(tài)添加下拉菜單（年）：<SCRIPTlanguage="JavaScript">for(i=1900;i<2050;i++)document.write('<option>'+i);</SCRIPT></SELECT>年<SELECTname=SMonchange=changeCld()style="FONT-SIZE:9pt">【實訓步驟】
課件制作人：實訓6對象編程的操作JavaScript代碼在Menu組件中動態(tài)添加下拉菜單（月）：<SCRIPTlanguage="JavaScript">for(i=1;i<13;i++)document.write('<option>'+i);</SCRIPT>在表格中添加單元格并設置單元格文本大小的HTML代碼如下：</SELECT>月</FONT><FONTcolor=#ffffffface=宋體id=GZstyle="FONT-SIZE:12pt"></FONT><BR></TD></TR><TRalign=middlebgColor=#e0e0e0><TDwidth=54style="font-size:9pt;padding:5pt;">日</TD><TDwidth=54style="font-size:9pt">一</TD><TDwidth=54style="font-size:9pt">二</TD><TDwidth=54style="font-size:9pt">三</TD><TDwidth=54style="font-size:9pt">四</TD><TDwidth=54style="font-size:9pt">五</TD><TDwidth=54style="font-size:9pt">六</TD></TR>【實訓步驟】
課件制作人：實訓6對象編程的操作JavaScript代碼在表格中添加6行7列的單元格。代碼如下：
<SCRIPTlanguage="JavaScript">vargNum;for(i=0;i<6;i++){document.write('<tralign=center>');for(j=0;j<7;j++){gNum=i*7+j;document.write('<tdid="GD'+gNum+'"><fontid="SD'+gNum+'"size=2face="ArialBlack"');if(j==0)document.write('color=red');if(j==6)document.write('color=#000080');document.write('TITLE=""></font><br><fontid="LD'+gNum+'"size=2style="font-size:9pt"></font></td>');}document.write('</tr>');}</SCRIPT>HTML代碼的相關結束標記。代碼如下：</TABLE></TD></TR></TABLE></FORM></CENTER>【實訓步驟】
課件制作人：實訓6對象編程的操作（4）編輯用于實現(xiàn)公歷日歷與農(nóng)歷日歷的JavaScript代碼。用數(shù)組記錄日歷中的相關信息。<SCRIPTlanguage="JavaScript">varlunarInfo=newArray(0x04bd8,0x04ae0,0x0a570,0x054d5,0x0d260,0x0d950,0x16554,0x056a0,0x09ad0,0x055d2,0x04ae0,0x0a5b6,0x0a4d0,0x0d250,0x1d255,0x0b540,0x0d6a0,0x0ada2,0x095b0,0x14977,0x04970,0x0a4b0,0x0b4b5,0x06a50,0x06d40,0x1ab54,0x02b60,0x09570,0x052f2,0x04970,0x06566,0x0d4a0,0x0ea50,0x06e95,0x05ad0,0x02b60,0x186e3,0x092e0,0x1c8d7,0x0c950,0x0d4a0,0x1d8a6,0x0b550,0x056a0,0x1a5b4,0x025d0,0x092d0,0x0d2b2,0x0a950,0x0b557,0x06ca0,0x0b550,0x15355,0x04da0,0x0a5d0,0x14573,0x052d0,0x0a9a8,0x0e950,0x06aa0,0x0aea6,0x0ab50,0x04b60,0x0aae4,0x0a570,0x05260,0x0f263,0x0d950,0x05b57,0x056a0,0x096d0,0x04dd5,0x04ad0,0x0a4d0,0x0d4d4,0x0d250,0x0d558,0x0b540,0x0b5a0,0x195a6,0x095b0,0x049b0,0x0a974,0x0a4b0,0x0b27a,0x06a50,0x06d40,0x0af46,0x0ab60,0x09570,0x04af5,0x04970,0x064b0,0x074a3,0x0ea50,0x06b58,0x055c0,0x0ab60,0x096d5,0x092e0,0x0c960,0x0d954,0x0d4a0,0x0da50,0x07552,0x056a0,0x0abb7,0x025d0,0x092d0,0x0cab5,0x0a950,0x0b4a0,0x0baa4,0x0ad50,0x055d9,0x04ba0,0x0a5b0,0x15176,0x052b0,0x0a930,0x07954,0x06aa0,0x0ad50,0x05b52,0x04b60,0x0a6e6,0x0a4e0,0x0d260,0x0ea65,0x0d530,0x05aa0,0x076a3,0x096d0,0x04bd7,0x04ad0,0x0a4d0,0x1d0b6,0x0d250,0x0d520,0x0dd45,0x0b5a0,0x056d0,0x055b2,0x049b0,0x0a577,0x0a4b0,0x0aa50,0x1b255,0x06d20,0x0ada0)varsolarMonth=newArray(31,28,31,30,31,30,31,31,30,31,30,31);varAnimals=newArray("鼠","牛","虎","兔","龍","蛇","馬","羊","猴","雞","狗","豬");varsolarTerm=newArray("小寒","大寒","立春","雨水","驚蟄","春分","清明","谷雨","立夏","小滿","芒種","夏至","小暑","大暑","立秋","處暑","白露","秋分","寒露","霜降","立冬","小雪","大雪","冬至"); //農(nóng)歷的節(jié)氣varsTermInfo=newArray(0,21208,42467,63836,85337,107014,128867,150921,173149,195551,218072,240693,263343,285989,308563,331033,353350,375494,397447,419210,440795,462224,483532,504758);varnStr1=newArray('日','一','二','三','四','五','六','七','八','九','十');varnStr2=newArray('初','十','廿','卅');【實訓步驟】
課件制作人：實訓6對象編程的操作用數(shù)組保存公歷的節(jié)日。varsFtv=newArray("0101元旦","0214情人節(jié)","0308婦女節(jié)","0312植樹節(jié)","0315消費者權益日","0401愚人節(jié)","0501勞動節(jié)","0504青年節(jié)","0512護士節(jié)","0601兒童節(jié)","0701建黨節(jié)","0801建軍節(jié)","0910教師節(jié)","0928孔子誕辰","1001國慶節(jié)","1006老人節(jié)","1024聯(lián)合國日","1224平安夜","1225圣誕節(jié)")【實訓步驟】
課件制作人：實訓6對象編程的操作用數(shù)組保存農(nóng)歷的節(jié)日。varlFtv=newArray("0101春節(jié)","0115元宵節(jié)","0505端午節(jié)","0707七夕情人節(jié)","0715中元節(jié)","0815中秋節(jié)","0909重陽節(jié)","1208臘八節(jié)","1223小年")自定義函數(shù)lYearDays(y)，用于返回農(nóng)歷y年的總天數(shù)。functionlYearDays(y){vari,sum=348;for(i=0x8000;i>0x8;i>>=1)sum+=(lunarInfo[y-1900]&i)?1:0;return(sum+leapDays(y));}自定義函數(shù)leapDays(y)，用于返回農(nóng)歷y年閏月的天數(shù)。functionleapDays(y){if(leapMonth(y))return((lunarInfo[y-1900]&0x10000)?30:29);elsereturn(0);}自定義函數(shù)leapMonth(y)，用于判斷y年的農(nóng)歷中哪個月是閏月,不是閏月返回0。functionleapMonth(y){return(lunarInfo[y-1900]&0xf);}自定義函數(shù)monthDays(y,m)，用于返回農(nóng)歷y年m月的總天數(shù)。functionmonthDays(y,m){return((lunarInfo[y-1900]&(0x10000>>m))?30:29);}【實訓步驟】
課件制作人：實訓6對象編程的操作自定義函數(shù)Dianaday()，用于算出當前月第一天的農(nóng)歷日期和當前農(nóng)歷日期下一個月農(nóng)歷的第一天日期。functionDianaday(objDate){vari,leap=0,temp=0;varbaseDate=newDate(1900,0,31);varoffset=(objDate-baseDate)/86400000;this.dayCyl=offset+40;this.monCyl=14;for(i=1900;i<2050&&offset>0;i++){temp=lYearDays(i)offset-=temp;this.monCyl+=12;}if(offset<0){offset+=temp;i--;this.monCyl-=12;}this.year=i;this.yearCyl=i-1864;leap=leapMonth(i); //閏哪個月
this.isLeap=false;for(i=1;i<13&&offset>0;i++){if(leap>0&&i==(leap+1)&&this.isLeap==false){
//閏月--i;this.isLeap=true;temp=leapDays(this.year);}else{temp=monthDays(this.year,i);}if(this.isLeap==true&&i==(leap+1))this.isLeap=false;//解除閏月
offset-=temp;if(this.isLeap==false)this.monCyl++;}if(offset==0&&leap>0&&i==leap+1)if(this.isLeap){this.isLeap=false;}else{this.isLeap=true;--i;--this.monCyl;}if(offset<0){offset+=temp;--i;--this.monCyl;}this.month=i;this.day=offset+1;}【實訓步驟】
課件制作人：實訓6對象編程的操作自定義函數(shù)solarDays(y,m)，用于返回公歷y年m+1月的天數(shù)。functionsolarDays(y,m){if(m==1)return(((y%4==0)&&(y%100!=0)||(y%400==0))?29:28);elsereturn(solarMonth[m]);}自定義函數(shù)calElement()用于記錄公歷和農(nóng)歷某天的日期。functioncalElement(sYear,sMonth,sDay,week,lYear,lMonth,lDay,isLeap){this.isToday=false;//公歷
this.sYear=sYear;this.sMonth=sMonth;this.sDay=sDay;this.week=week;//農(nóng)歷
this.lYear=lYear;this.lMonth=lMonth;this.lDay=lDay;this.isLeap=isLeap;//節(jié)日記錄
this.lunarFestival=''; //農(nóng)歷節(jié)日
this.solarFestival=''; //公歷節(jié)日
this.solarTerms=''; //節(jié)氣}【實訓步驟】
課件制作人：實訓6對象編程的操作自定義函數(shù)sTerm(y,n)用于返回某年的第n個節(jié)氣為幾日（從小寒算起）。functionsTerm(y,n){varoffDate=newDate((31556925974.7*(y-1900)+sTermInfo[n]*60000)+Date.UTC(1900,0,6,2,5));return(offDate.getUTCDate())}自定義函數(shù)calendar(y,m)用于保存y年m+1月的相關信息。varfat=mat=9;vareve=0;functioncalendar(y,m){fat=mat=0;varsDObj,lDObj,lY,lM,lD=1,lL,lX=0,tmp1,tmp2;varlDPOS=newArray(3);varn=0;varfirstLM=0;sDObj=newDate(y,m,1); //當月第一天的信息
this.length=solarDays(y,m); //公歷當月天數(shù)
this.firstWeek=sDObj.getDay(); //公歷當月1日星期幾
if((m+1)==5){fat=sDObj.getDay()}if((m+1)==6){mat=sDObj.getDay()}【實訓步驟】
課件制作人：實訓6對象編程的操作for(vari=0;i<this.length;i++){if(lD>lX){sDObj=newDate(y,m,i+1); //當月第一天的信息
lDObj=newDianaday(sDObj); //農(nóng)歷
lY=lDObj.year; //農(nóng)歷年
lM=lDObj.month; //農(nóng)歷月
lD=lDObj.day; //農(nóng)歷日
lL=lDObj.isLeap; //農(nóng)歷是否閏月
lX=lL?leapDays(lY):monthDays(lY,lM);
//農(nóng)歷當月最后一天
if(lM==12){eve=lX}if(n==0)firstLM=lM;lDPOS[n++]=i-lD+1;}this[i]=newcalElement(y,m+1,i+1,nStr1[(i+this.firstWeek)%7],lY,lM,lD++,lL);if((i+this.firstWeek)%7==0){this[i].color='red'; //周日顏色}}//節(jié)氣
tmp1=sTerm(y,m*2)-1;tmp2=sTerm(y,m*2+1)-1;this[tmp1].solarTerms=solarTerm[m*2];this[tmp2].solarTerms=solarTerm[m*2+1];if((this.firstWeek+12)%7==5) //黑色星期五
this[12].solarFestival+='黑色星期五';
if(y==tY&&m==tM)this[tD-1].isToday=true; //今日}【實訓步驟】
課件制作人：實訓6對象編程的操作自定義函數(shù)cDay(
)，用中文顯示農(nóng)歷的日期。functioncDay(d){vars;switch(d){case10:s='初十';break;case20:s='二十';break;break;case30:s='三十';break;break;default:s=nStr2[Math.floor(d/10)];s+=nStr1[d%10];}return(s);}【實訓步驟】
課件制作人：實訓6對象編程的操作自定義函數(shù)drawCld(
)，在表格中顯示公歷和農(nóng)歷的日期以及相關節(jié)日。varcld;functiondrawCld(SY,SM){varTF=true;varp1=p2="";vari,sD,s,size;cld=newcalendar(SY,SM);GZ.innerHTML=' 【'+Animals[(SY-4)%12]+'】'; //生肖
for(i=0;i<42;i++){sObj=eval('SD'+i);lObj=eval('LD'+i);sObj.className='';sD=i-cld.firstWeek;if(sD>-1&&sD<cld.length){ //日期內(nèi)
sObj.innerHTML=sD+1;if(cld[sD].isToday){sObj.style.color='#9900FF';} //今日顏色
else{sObj.style.color='';}if(cld[sD].lDay==1){ //顯示農(nóng)歷月
lObj.innerHTML='<b>'+(cld[sD].isLeap?'閏':'')+cld[sD].lMonth+'月'+(monthDays(cld[sD].lYear,cld[sD].lMonth)==29?'小':'大')+'</b>';}else{lObj.innerHTML=cDay(cld[sD].lDay);}//顯示農(nóng)歷日
varSlfw=Ssfw=null;s=cld[sD].solarFestival;【實訓步驟】
課件制作人：實訓6對象編程的操作for(varipp=0;ipp<lFtv.length;ipp++){ //農(nóng)歷節(jié)日
if(parseInt(lFtv[ipp].substr(0,2))==(cld[sD].lMonth)){if(parseInt(lFtv[ipp].substr(2,4))==(cld[sD].lDay)){lObj.innerHTML=lFtv[ipp].substr(5);Slfw=lFtv[ipp].substr(5);}}
溫馨提示
- 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
- 4. 未經(jīng)權益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負責。
- 6. 下載文件中如有侵權或不適當內(nèi)容，請與我們聯(lián)系，我們立即糾正。
- 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 課題申報參考：開放式創(chuàng)新網(wǎng)絡中“數(shù)字悖論”現(xiàn)象研究：形成機理、作用機制和優(yōu)化路徑
- 2025年度企業(yè)臨時工培訓與考核合同3篇
- 商場煙感報警系統(tǒng)采購與安裝合同（二零二五年）2篇
- 2025年度個人生育保險代繳服務合同范本4篇
- 2025版出臺二手房交易稅費計算與申報合同3篇
- 二零二五年度餐廳轉讓合同范本（含會員卡及積分系統(tǒng)）3篇
- 2025年度墓地轉賣及墓園墓碑石材更換合同4篇
- 2025年度新能源汽車研發(fā)借款合同范本發(fā)布
- 二零二五年度多功能鏟車租賃與技術支持合同3篇
- 二零二五年度農(nóng)業(yè)用電變壓器項目融資與風險管理合同
- 乳腺癌的綜合治療及進展
- 【大學課件】基于BGP協(xié)議的IP黑名單分發(fā)系統(tǒng)
- 2025年八省聯(lián)考高考語文試題真題解讀及答案詳解課件
- 信息安全意識培訓課件
- 2024年山東省泰安市初中學業(yè)水平生物試題含答案
- 美的MBS精益管理體系
- 中國高血壓防治指南（2024年修訂版）解讀課件
- 2024安全員知識考試題（全優(yōu)）
- 法律訴訟及咨詢服務 投標方案（技術標）
- 格式塔心理咨詢理論與實踐
- 英語六級詞匯（全）
評論
0/150
提交評論