版權(quán)說(shuō)明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)
文檔簡(jiǎn)介
JavaScript應(yīng)用一、教學(xué)目標(biāo)掌握用JavaScript實(shí)現(xiàn)強(qiáng)制瀏覽者點(diǎn)擊某鏈接。二、教材內(nèi)容分析該部分學(xué)習(xí)重點(diǎn)是用JavaScript制作動(dòng)態(tài)HTML，要求學(xué)生能掌握從網(wǎng)上搜索并下載免費(fèi)的源代碼并將其插入網(wǎng)頁(yè)中的方法（代碼復(fù)用技術(shù)）。這部分內(nèi)容要真正掌握，學(xué)生必須親自動(dòng)手體驗(yàn)，做到“做中學(xué)”。三、教學(xué)方法及策略采用任務(wù)驅(qū)動(dòng)法，以完成該節(jié)JavaScript的學(xué)習(xí)。四、教學(xué)過(guò)程教師活動(dòng)學(xué)生活動(dòng)1．通過(guò)投影展示強(qiáng)制瀏覽者點(diǎn)擊某鏈接效果，引出“強(qiáng)制瀏覽者點(diǎn)擊某鏈接”范例。2．提供該案例JavaScript源代碼。3．教師講解此源代碼的使用方法以及實(shí)現(xiàn)過(guò)程(投影展示，內(nèi)容見(jiàn)附錄1)。教師巡堂，指導(dǎo)學(xué)生完成這個(gè)任務(wù)。根據(jù)教師的講解，學(xué)生自己練習(xí)強(qiáng)制瀏覽者鏈接的效果，同時(shí)總結(jié)JavaScript的用法。組織、引導(dǎo)學(xué)生發(fā)現(xiàn)JavaScript的知識(shí)規(guī)律，并做出總結(jié)。發(fā)現(xiàn)、總結(jié)和掌握腳本語(yǔ)言JavaScript使用的共性和規(guī)律，熟練掌握把JavaScript源代碼加入到HTML中的方法。讓學(xué)生上網(wǎng)，以“JavaScript動(dòng)態(tài)網(wǎng)頁(yè)制作寶庫(kù)”為搜索目標(biāo)，搜索精彩的實(shí)例，并存入本地機(jī)，自行體驗(yàn)一例。學(xué)生按照老師要求，完成任務(wù)。讓學(xué)生討論JavaScript腳本語(yǔ)言對(duì)傳統(tǒng)網(wǎng)頁(yè)造成的沖擊。思考和討論JavaScript在動(dòng)態(tài)網(wǎng)頁(yè)制作中的作用和意義，能夠從網(wǎng)絡(luò)中下載自己需要的免費(fèi)的JavaScript源代碼為自己服務(wù)。要求學(xué)生填寫(xiě)學(xué)習(xí)總結(jié)表5-3（見(jiàn)附錄2）。
附錄1:在body后加入如下代碼:<scriptlanguage="JavaScript"><!--varFlag=0--></script>假如你的廣告鏈接圖為"06．jpg",鏈接網(wǎng)址為"，則應(yīng)采用如下代碼：<ahref=""target="_blank"onclick="Flag=1;returntrue"><imgsrc="06．jpg"border="0"height=""width=""></a>height和width中的數(shù)值根據(jù)需要設(shè)置。如果你不想讓瀏覽者進(jìn)入你的網(wǎng)頁(yè)""，則加入如下代碼：<ahref=""target="_blank"；onclick="if(Flag==1)returntrue;else{alert('如果您想從本站下載軟件，請(qǐng)先點(diǎn)擊上面的廣告，再把它最小化，這不會(huì)影響您的瀏覽，多謝?。?;returnfalse}"onmouseover="returntrue">軟件下載</a>注意：上面alert后的內(nèi)容在編寫(xiě)時(shí)不能斷行，否則會(huì)出錯(cuò)。附錄2：表5-3學(xué)習(xí)總結(jié)表學(xué)習(xí)中遇到的問(wèn)題總結(jié)使用代碼復(fù)用技術(shù)需要注意的問(wèn)題。
你從網(wǎng)上找到了哪些JavaScript功能？?jī)?yōu)點(diǎn)表現(xiàn)如何？你的心得體會(huì)是什么？
一、教學(xué)目標(biāo)進(jìn)一步理解動(dòng)態(tài)Html，以簡(jiǎn)單的JavaScript特效為例，使學(xué)生加深對(duì)動(dòng)態(tài)Html的理解，并能夠把這些特效插入到個(gè)人網(wǎng)頁(yè)的合適位置；要求學(xué)生了解動(dòng)態(tài)Html的設(shè)計(jì)原則。二、教學(xué)內(nèi)容分析本節(jié)沒(méi)有太多新概念，主要是對(duì)前面所學(xué)的內(nèi)容的擴(kuò)展和提升。重點(diǎn)是利用JavaScript制作動(dòng)態(tài)Html以及利用JavaScript修飾自己的主題網(wǎng)站。前半部分主要講授幾種JavaScript特效，后半部分介紹了動(dòng)態(tài)Html的設(shè)計(jì)原則，并要求學(xué)生能夠?qū)W(wǎng)頁(yè)的設(shè)計(jì)進(jìn)行客觀的評(píng)價(jià)。三、教學(xué)建議及策略本節(jié)沒(méi)有太多概念，教學(xué)內(nèi)容比較靈活，教師教授的方式可以多種多樣，可以邊學(xué)邊練，也可以教師先演示學(xué)生分小組進(jìn)行實(shí)踐討論。目的在于使學(xué)生熟練應(yīng)用JavaScript，能夠修飾自己的主題網(wǎng)站并使用網(wǎng)頁(yè)制作軟件和發(fā)布網(wǎng)站。要求教師課前做好充分的準(zhǔn)備，提供較多的典型的有特色的JavaScript源代碼供學(xué)生參考，培養(yǎng)學(xué)生的創(chuàng)新能力與探索精神，利用動(dòng)態(tài)網(wǎng)頁(yè)制作原則合理地修飾自己的網(wǎng)站。四、教學(xué)過(guò)程授課導(dǎo)入為了提供給最終用戶以使用方便、界面美觀的感受，很多基于特定的客戶端程序都轉(zhuǎn)向趨向于采用瀏覽器客戶端。而早期的靜態(tài)的、缺乏交互的HTML頁(yè)面文檔適應(yīng)不了這種要求。JavaScript是一種基于對(duì)象的腳本編程語(yǔ)言，是“瀏覽器”上的程序語(yǔ)言。當(dāng)Web服務(wù)器輸出內(nèi)容（包括JavaScript的程序代碼）到瀏覽器時(shí)，JavaScript可以操縱瀏覽器上的一切內(nèi)容，在瀏覽器上提供用戶交互，界面美化，增加Web界面的“智能性”。教師講授JavaScript是一種腳本語(yǔ)言，它是同HTML文檔一起使用的，Web服務(wù)器產(chǎn)生輸出HTML內(nèi)容的同時(shí)，也輸出一些JavaScript程序代碼到瀏覽器客戶端。JavaScript由瀏覽器解釋執(zhí)行，不同的瀏覽器，或者是同一瀏覽器的不同版本，對(duì)JavaScript的支持會(huì)有一些差異。本書(shū)不討論這些問(wèn)題，并假定用戶采用IE5．0以上版本的瀏覽器。JavaScript是一種基于對(duì)象的語(yǔ)言，通過(guò)JavaScript代碼來(lái)操作對(duì)象——訪問(wèn)或者設(shè)置對(duì)象的屬性，編寫(xiě)對(duì)象的特定的事件（方法）代碼。教師演示我們上網(wǎng)沖浪在瀏覽網(wǎng)頁(yè)時(shí)經(jīng)常會(huì)看到用JavaScript腳本實(shí)現(xiàn)的各種文字特效，除了用它做文字特效恐怕別的功能就很少見(jiàn)了。我們通過(guò)這個(gè)例子介紹用JavaScript技術(shù)為自己的網(wǎng)頁(yè)制作充滿動(dòng)感和個(gè)性的鼠標(biāo)指針。將以下代碼加入網(wǎng)頁(yè)的<BODY>區(qū)中，同學(xué)們即可看到鼠標(biāo)箭頭周?chē)鷰讉€(gè)不停運(yùn)動(dòng)的彩色小球，并且您的鼠標(biāo)指到哪里，彩色小球就跟到哪里。<scriptlanguage="JavaScript">functionYY_Layerfx(yyleft,yytop,yyfnx,yyfny,yydiv,yybilder,yyloop,yyto,yycnt,yystep){//v1．2//if((document．layers)||(document．a(chǎn)ll)){with(Math){yynextx=eval(yyfnx)}with(Math){yynexty=eval(yyfny)}yycnt=(yyloop&&yycnt>=yystep*yybilder)？0:yycnt+yystep;if(document．layers){eval(yydiv+"．top="+(yynexty+yytop))eval(yydiv+"．left="+(yynextx+yyleft))}if(document．a(chǎn)ll){eval("yydiv=yydiv．replace(/．layers/gi,'．a(chǎn)ll')");eval(yydiv+"．style．pixelTop="+(yynexty+yytop));eval(yydiv+"．style．pixelLeft="+(yynextx+yyleft));}argStr=＇YY_Layerfx(＇+yyleft+＇,＇+yytop+＇,"＇+yyfnx+＇","＇+yyfny+＇","＇+yydiv+＇",＇+yybilder+＇,＇+yyloop+＇,＇+yyto+＇,＇+yycnt+＇,＇+yystep+＇)＇;if(yycnt<=yystep*yybilder){eval(yydiv+"．yyto=setTimeout(argStr,yyto)");}}}functionYY_Mousetrace(evnt){//if(yyns4){if(evnt．pageX){yy_ml=evnt．pageX;yy_mt=evnt．pageY;}}else{yy_ml=+document．body．scrollLeft);yy_mt=+document．body．scrollTop);}if(yy_tracescript)eval(yy_tracescript)}</script><divid="yyd0"style="BACKGROUND-COLOR:#19636c;BORDER-BOTTOM:#0000001px;BORDER-LEFT:#0000001px;BORDER-RIGHT:#0000001px;BORDER-TOP:#0000001px;CLIP:rect(0px3px3px0px);HEIGHT:3px;LEFT:10px;POSITION:absolute;TOP:50px;WIDTH:3px;Z-INDEX:1;layer-background-color:#19636c"></div><divid="yyd1"style="BACKGROUND-COLOR:#708574;BORDER-BOTTOM:#0000001px;BORDER-LEFT:#0000001px;BORDER-RIGHT:#0000001px;BORDER-TOP:#0000001px;CLIP:rect(0px3px3px0px);HEIGHT:3px;LEFT:20px;POSITION:absolute;TOP:50px;WIDTH:3px;Z-INDEX:1;layer-background-color:#708574"></div><divid="yyd2"style="BACKGROUND-COLOR:#379bbf;BORDER-BOTTOM:#0000001px;BORDER-LEFT:#0000001px;BORDER-RIGHT:#0000001px;BORDER-TOP:#0000001px;CLIP:rect(0px3px3px0px);HEIGHT:3px;LEFT:30px;POSITION:absolute;TOP:50px;WIDTH:3px;Z-INDEX:1;layer-background-color:#379bbf"></div><divid="yyd3"style="BACKGROUND-COLOR:#25184c;BORDER-BOTTOM:#0000001px;BORDER-LEFT:#0000001px;BORDER-RIGHT:#0000001px;BORDER-TOP:#0000001px;CLIP:rect(0px3px3px0px);HEIGHT:3px;LEFT:40px;POSITION:absolute;TOP:50px;WIDTH:3px;Z-INDEX:1;layer-background-color:#25184c"></div><divid="yyd4"style="BACKGROUND-COLOR:#31bd3c;BORDER-BOTTOM:#0000001px;BORDER-LEFT:#0000001px;BORDER-RIGHT:#0000001px;BORDER-TOP:#0000001px;CLIP:rect(0px3px3px0px);HEIGHT:3px;LEFT:50px;POSITION:absolute;TOP:50px;WIDTH:3px;Z-INDEX:1;layer-background-color:#31bd3c"></div><divid="yyd5"style="BACKGROUND-COLOR:#c11efd;BORDER-BOTTOM:#0000001px;BORDER-LEFT:#0000001px;BORDER-RIGHT:#0000001px;BORDER-TOP:#0000001px;CLIP:rect(0px3px3px0px);HEIGHT:3px;LEFT:60px;POSITION:absolute;TOP:50px;WIDTH:3px;Z-INDEX:1;layer-background-color:#c11efd"></div><script>varyyns4=？true:false;varyy_mt=0;varyy_ml=0;document．onmousemove=YY_Mousetrace;yy_tracescript='';
if(yyns4){(Event．MOUSEMOVE);YY_Mousetrace('',',document．YY_Mousetrace1')}YY_Layerfx(0,0,'yy_ml+cos((15*sin(yycnt/39．83007847812662))+0)*150*(sin(10+yycnt/20)+0．2)*cos(yycnt/20)','yy_mt+sin((15*sin(yycnt/34．224861639800686))+0)*150*(sin(10+yycnt/20)+0．2)*cos(yycnt/20)','document．layers[\'yyd0\']',2000,true,80,0,1);YY_Layerfx(0,0,'yy_ml+cos((15*sin(yycnt/27．66510707209673))+30)*150*(sin(10+yycnt/20)+0．2)*cos(yycnt/20)','yy_mt+sin((15*sin(yycnt/9．240632767417667))+30)*150*(sin(10+yycnt/20)+0．2)*cos(yycnt/20)','document．layers[\'yyd1\']',2000,true,80,0,1);YY_Layerfx(0,0,'yy_ml+cos((15*sin(yycnt/16．45318944579641))+60)*150*(sin(10+yycnt/20)+0．2)*cos(yycnt/20)','yy_mt+sin((15*sin(yycnt/16．0564452288292))+60)*150*(sin(10+yycnt/20)+0．2)*cos(yycnt/20)','document．layers[\'yyd2\']',2000,true,80,0,1);YY_Layerfx(0,0,'yy_ml+cos((15*sin(yycnt/6．95348954836835))+90)*150*(sin(10+yycnt/20)+0．2)*cos(yycnt/20)','yy_mt+sin((15*sin(yycnt/44．13697049887155))+90)*150*(sin(10+yycnt/20)+0．2)*cos(yycnt/20)','document．layers[\'yyd3\']',2000,true,80,0,1);YY_Layerfx(0,0,'yy_ml+cos((15*sin(yycnt/33．90077294583733))+120)*150*(sin(10+yycnt/20)+0．2)*cos(yycnt/20)','yy_mt+sin((15*sin(yycnt/2．2378828869411587))+120)*150*(sin(10+yycnt/20)+0．2)*cos(yycnt/20)','document．layers[\'yyd4\']',2000,true,80,0,1);
YY_Layerfx(0,0,'yy_ml+cos((15*sin(yycnt/37．858312521039835))+150)*150*(sin(10+yycnt/20)+0．2)*cos(yycnt/20)','yy_mt+sin((15*sin(yycnt/18．083839795990098))+150)*150*(sin(10+yycnt/20)+0．2)*cos(yycnt/20)','document．layers[\'yyd5\']',2000,true,80,0,1);</script>效果如圖5-5所示：圖5-5鼠標(biāo)特效舉例在鼠標(biāo)的周?chē)嗔艘恍┪宀世_紛的彩色小球，并且會(huì)跟隨鼠標(biāo)位置的變化發(fā)生變化。我們?cè)倏吹诙€(gè)例子。<BODYOnLoad="textticker()"bgcolor="#FFFFFF"><SCRIPTLANGUAGE="JavaScript">varmax=0;functiontextlist(){max=textlist．a(chǎn)rguments．length;for(i=0;i<max;i++)this[i]=textlist．a(chǎn)rguments[i];}tl=newtextlist(“其實(shí)動(dòng)態(tài)網(wǎng)頁(yè)的制作并不難，希望大家通過(guò)自己的努力學(xué)習(xí)把自己的網(wǎng)頁(yè)修飾的更加漂亮！”
);varx=0;pos=0;varl=tl[0]．length;functiontextticker(){document．tickform．tickfield．value=tl[x]．substring(0,pos)+"_";if(pos++==l){pos=0;setTimeout("textticker()",2
溫馨提示
- 1. 本站所有資源如無(wú)特殊說(shuō)明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。
最新文檔
- 二零二五年度汽車(chē)銷(xiāo)售公司股份合資與銷(xiāo)售網(wǎng)絡(luò)擴(kuò)張協(xié)議3篇
- 二零二五年度最高額反擔(dān)保合同司法救濟(jì)途徑3篇
- 2024年甲乙雙方關(guān)于紡織機(jī)械塑料管材購(gòu)銷(xiāo)合同
- 小學(xué)生數(shù)學(xué)邏輯思維與表達(dá)能力提升
- 2024年適用綜合布線項(xiàng)目施工協(xié)議樣本版B版
- 2024版樣品借用協(xié)議
- 小學(xué)寫(xiě)作教學(xué)與信息素養(yǎng)的融合
- 2024版抵押擔(dān)保借款合同訴狀
- 2025年外研版二年級(jí)數(shù)學(xué)下冊(cè)階段測(cè)試試卷
- 2025年北師大版八年級(jí)物理上冊(cè)月考試卷含答案
- S7-200SMARTPLC應(yīng)用技術(shù)PPT完整全套教學(xué)課件
- 22G101平法識(shí)圖培訓(xùn)試題庫(kù)2022
- 當(dāng)代世界經(jīng)濟(jì)與政治學(xué)習(xí)通課后章節(jié)答案期末考試題庫(kù)2023年
- 2023-2024學(xué)年山東省臨沂市小學(xué)語(yǔ)文六年級(jí)期末評(píng)估考試題附參考答案和詳細(xì)解析
- 設(shè)備到貨簽收單
- 2021傳播心理學(xué)課程教學(xué)大綱
- 農(nóng)學(xué)技能高考【種植類(lèi)】復(fù)習(xí)題庫(kù)大全-2、《植物生產(chǎn)與環(huán)境》-下（判斷題）
- 艾瑞咨詢2023年中國(guó)脾虛人群白皮書(shū)
- 抖音直播電商項(xiàng)目計(jì)劃書(shū)抖音電商創(chuàng)業(yè)商業(yè)計(jì)劃書(shū)抖音直播帶貨計(jì)劃書(shū)抖音電商運(yùn)營(yíng)方案
- 26個(gè)英文字母描紅字帖
- TCPQS XF003-2023 滅火器產(chǎn)品維修、更換及售后服務(wù)
評(píng)論
0/150
提交評(píng)論