計(jì)算機(jī)軟件及應(yīng)用認(rèn)識(shí)jaascript對(duì)象任務(wù)一課件

, ,教學(xué)目的：了解什么是表單 了解表單的屬性 掌握各種按鈕的用法 掌握各種文本框的類(lèi)型 教學(xué)重點(diǎn)：了解表單的屬性 掌握各種按鈕的用法 掌握各種文本框的類(lèi)型 教學(xué)難點(diǎn)：掌握各種按鈕的用法 掌握各種文本框的類(lèi)型,實(shí)際就是在Title欄中滾動(dòng)顯示內(nèi)容，即根據(jù)時(shí)間的不同，頁(yè)面的Title顯示不同的內(nèi)容,了解JavaScript概述 JavaScript的特點(diǎn),1.JavaScript概述,是一種基于對(duì)象和事件驅(qū)動(dòng)的客戶(hù)端腳本語(yǔ)言 ECMAScript：語(yǔ)言的基本語(yǔ)法和對(duì)象 DOM：作用于網(wǎng)頁(yè)內(nèi)容的方法和接口 BOM：與瀏覽器交互的方法和接口,JavaScript語(yǔ)言概況,什么是JavaScript,向HTML頁(yè)面添加交互行為 一種腳本語(yǔ)言 數(shù)行可執(zhí)行計(jì)算機(jī)代碼組成 直接嵌入HTML頁(yè)面 一種解釋性語(yǔ)言 無(wú)需購(gòu)買(mǎi)即可使用,JavaScript功能,為HTML設(shè)計(jì)師提供了一種編程工具 可以將動(dòng)態(tài)的文本放入HTML頁(yè)面 可以對(duì)事件作出響應(yīng) 可以讀取和改變HTML元素內(nèi)容 驗(yàn)證數(shù)據(jù) 檢測(cè)訪(fǎng)問(wèn)者的瀏覽器 創(chuàng)建cookies,JavaScript應(yīng)用,客戶(hù)端應(yīng)用 服務(wù)器端應(yīng)用,第一個(gè)JavaScript程序, alert(“歡迎進(jìn)入這個(gè)美妙的JavaScript世界！“); alert(“今后我們將共同學(xué)習(xí)JavaScript知識(shí)！“); ,顯示效果:,這段程序一共彈出兩個(gè)消息窗口，第一個(gè)為：,點(diǎn)擊第一個(gè)消息彈出窗口的“確定”按鈕后，彈出第二個(gè)窗口，如下：,JavaScript文件的特點(diǎn),是HTML文檔，是標(biāo)準(zhǔn)的HTML格式 程序代碼是可用字處理軟件瀏覽的文本，出現(xiàn)在HTML相關(guān)區(qū)域 之間可加入腳本 寫(xiě)成type=“text/javascript“ alert()窗口對(duì)象方法 ，常用調(diào)試程序 通過(guò)標(biāo)識(shí)說(shuō)明 單行注釋?zhuān)?）,JavaScript的特點(diǎn),簡(jiǎn)單性 動(dòng)態(tài)性 基于對(duì)象的語(yǔ)言 安全性 跨平臺(tái)性 節(jié)省CGI的交互時(shí)間,JavaScript語(yǔ)法,ECMAScript變量命名 ECMAScript變量類(lèi)型 每行結(jié)尾的分號(hào)最好寫(xiě)上 ECMAScript注釋 括號(hào)表示代碼塊, document.write(“這個(gè)例子是讓大家對(duì)Document對(duì)象有一個(gè)初步“+ “了解!“) document.title =設(shè)置文檔標(biāo)題等價(jià)于HTML的標(biāo)簽 document.bgColor=“#FFFF66“ document.fgColor = “#FF0000“ document.linkColor = “#0000CC“ document.vlinkColor = “#0FFF66“ document.write(“),document.write(“document.write()添加文字的顯示樣式?！? document.write(“) 您還可以找到 MSDN上有關(guān) ASP.NET 的文檔。 ,3.Javascript函數(shù),函數(shù)是一組可以隨時(shí)隨地運(yùn)行的語(yǔ)句 函數(shù)是ECMAScript的核心 基本語(yǔ)法 function functionName(arg0,arg1,argN) statements ,函數(shù)調(diào)用,可以通過(guò)其名字加上括號(hào)中的參數(shù)進(jìn)行調(diào)用 function sayHi(sName, sMessage) alert(“Hello “ + sName + sMessage); sayHi(“David“, “ Nice to meet you!“); ,返回函數(shù)值,函數(shù)確實(shí)有值，但不必明確地聲明 使用return運(yùn)算符后面跟上要返回的值 function sum(iNum1, iNum2) return iNum1 + iNum2; ,案例步驟, var text=document.title var timerID function newtext() clearTimeout(timerID) document.title=text.substring(1,text.length)+text.substring(0,1) text=document.title.substring(0,text.length) timerID = setTimeout(“newtext()“, 100) newtext() ,顯示效果,在JavaScript中也有基本的運(yùn)算，這個(gè)案例中就以水波文字的效果來(lái)學(xué)習(xí)運(yùn)算。,JavaScript中的運(yùn)算符是可以完成操作的一系列符號(hào)。有+、-、*、/、!=、=、！、|、|、+=,JavaScrip運(yùn)算,算術(shù)運(yùn)算符 + 、+ 、-、-、*、/、%、+= 邏輯運(yùn)算符 &、|、！、?: 比較運(yùn)算符 =、!=、=、=,案例步驟 水波文字效果 , var step=3; var xstep=0; var msg=飛流直下三千尺，疑是銀河落九天！; water.innerHTML=msg function wave() document.all.water.style.filter=wave(freq=3,strength=5,+phase=+xstep+, lightstrength=45, add=0, enabled=1); xstep+=step; TIMER=setTimeout(wave(),10); ,顯示效果,在JavaScript中我們也會(huì)用到程序控制語(yǔ)句，像其它的編程語(yǔ)言一樣，這里我們用在頁(yè)面中輸入的年月日是否正確來(lái)學(xué)習(xí)控制語(yǔ)句。,程序控制語(yǔ)句可以使得整個(gè)程序減小混亂。,JavaScript程序語(yǔ)句IF語(yǔ)句,if (表達(dá)式) 語(yǔ)句段1； else 語(yǔ)句段2； ,JavaScript程序語(yǔ)句IF應(yīng)用, Javascript程序控制流IF語(yǔ)句應(yīng)用 var activedate=new Date(); activehour=activedate.getHours() if (activehour=6 & activehour“) else if(activehour=12 & activehour“) else if(activehour=18 & activehour“) else if(activehour=24 | activehour“) ,JavaScript程序語(yǔ)句FOR循環(huán),for (初始化；條件；增量) 語(yǔ)句集,JavaScript程序語(yǔ)句FOR循環(huán)應(yīng)用, Javascript程序FOR語(yǔ)句應(yīng)用 var i=1; var j=1; for (i=1;i“); ,JavaScript程序語(yǔ)句while循環(huán)語(yǔ)句,while （條件） 語(yǔ)句集；,JavaScript程序語(yǔ)句while循環(huán)語(yǔ)句應(yīng)用, Javascript程序while語(yǔ)句應(yīng)用 var i=1; var j=1; while (i“); i+; ,JavaScript程序語(yǔ)句DO WHILE,do 語(yǔ)句集； while （條件）；,JavaScript程序語(yǔ)句DO WHILE應(yīng)用, Javascript程序dowhile語(yǔ)句應(yīng)用 var i=1; var j=1; do j=1; do document.write(i+“*“+j+“=“+ (i*j)+“ “); j+; while(j“); i+; while(i ,JavaScript程序語(yǔ)句 Break和Continue,break命令可以終止循環(huán)的運(yùn)行