第12講靜態(tài)網站項目設計與開發(fā)_第1頁
第12講靜態(tài)網站項目設計與開發(fā)_第2頁
第12講靜態(tài)網站項目設計與開發(fā)_第3頁
第12講靜態(tài)網站項目設計與開發(fā)_第4頁
第12講靜態(tài)網站項目設計與開發(fā)_第5頁
已閱讀5頁,還剩32頁未讀, 繼續(xù)免費閱讀

下載本文檔

版權說明:本文檔由用戶提供并上傳,收益歸屬內容提供方,若內容存在侵權,請進行舉報或認領

文檔簡介

靜態(tài)網站項目設計與開發(fā)授課老師:何王科靜態(tài)網站項目設計與開發(fā)課程教學信息授課專業(yè)互聯網營銷授課班級計網1401班計網1402班課次第12講授課時間10月18日星期星期日節(jié)次1~2授課地點知行樓513機房授課教師何王科教學日志教學日志教學文件課程標準授課計劃教學設計靜態(tài)網站項目設計與開發(fā)教學任務JavaScript基礎知識目標:htmlcss基礎知識能力目標:熟練運用DIV+CSS布局重點:JavaScript函數JavaScript運算符JavaScript比較和邏輯運算符難點:JavaScript對象教學方法:案例法、演示法、討論法、任務驅動法課堂類型:講授課教具:多媒體、VMare、XP、windows2003、Packettracert、GNS3導入課程首先說一下我們這節(jié)課的知識點JavaScript對象JavaScript函數JavaScript運算符JavaScript比較和邏輯運算符JavaScript對象JavaScript中的所有事務都是對象:字符串、數字、數組、日期,等等。在JavaScript中,對象是擁有屬性和方法的數據。屬性和方法屬性是與對象相關的值。方法是能夠在對象上執(zhí)行的動作。JavaScript對象舉例:汽車就是現實生活中的對象。汽車的屬性:=Fiatcar.model=500car.weight=850kgcar.color=white汽車的方法:car.start()car.drive()ar.brake()JavaScript中的對象在JavaScript中,對象是數據(變量),擁有屬性和方法。當您像這樣聲明一個JavaScript變量時:vartxt="Hello";您實際上已經創(chuàng)建了一個JavaScript字符串對象。字符串對象擁有內建的屬性length。對于上面的字符串來說,length的值是5。字符串對象同時擁有若干個內建的方法。JavaScript中的對象屬性:txt.length=5方法:txt.indexOf()txt.replace()txt.search()提示:在面向對象的語言中,屬性和方法常被稱為對象的成員。

創(chuàng)建JavaScript對象JavaScript中的幾乎所有事務都是對象:字符串、數字、數組、日期、函數,等等。你也可以創(chuàng)建自己的對象。本例創(chuàng)建名為"person"的對象,并為其添加了四個屬性:創(chuàng)建JavaScript對象<body><script>person=newObject();person.firstname="Bill";person.lastname="Gates";person.age=56;person.eyecolor="blue";document.write(person.firstname+"is"+person.age+"yearsold.");</script></body>創(chuàng)建新JavaScript對象有很多不同的方法,并且您還可以向已存在的對象添加屬性和方法。訪問對象的屬性訪問對象屬性的語法是:objectName.propertyName

本例使用String對象的length屬性來查找字符串的長度:varmessage="HelloWorld!";varx=message.length;在以上代碼執(zhí)行后,x的值是:12訪問對象的方法您可以通過下面的語法調用方法:objectName.methodName()這個例子使用String對象的toUpperCase()方法來把文本轉換為大寫:varmessage="Helloworld!";varx=message.toUpperCase();在以上代碼執(zhí)行后,x的值是:HELLOWORLD!JavaScript函數函數是由事件驅動的或者當它被調用時執(zhí)行的可重復使用的代碼塊。<head><script>functionmyFunction(){alert("HelloWorld!");}</script></head><body><buttononclick="myFunction()">點擊這里</button></body>JavaScript函數語法函數就是包裹在花括號中的代碼塊,前面使用了關鍵詞function:functionfunctionname(){這里是要執(zhí)行的代碼}當調用該函數時,會執(zhí)行函數內的代碼。可以在某事件發(fā)生時直接調用函數(比如當用戶點擊按鈕時),并且可由JavaScript在任何位置進行調用。提示:JavaScript對大小寫敏感。關鍵詞function必須是小寫的,并且必須以與函數名稱相同的大小寫來調用函數。調用帶參數的函數在調用函數時,您可以向其傳遞值,這些值被稱為參數。這些參數可以在函數中使用。您可以發(fā)送任意多的參數,由逗號(,)分隔:myFunction(argument1,argument2)當您聲明函數時,請把參數作為變量來聲明:functionmyFunction(var1,var2){這里是要執(zhí)行的代碼

}變量和參數必須以一致的順序出現。第一個變量就是第一個被傳遞的參數的給定的值,以此類推。調用帶參數的函數<body><p>點擊這個按鈕,來調用帶參數的函數。</p><buttononclick="myFunction('BillGates','CEO')">點擊這里</button><script>functionmyFunction(name,job){alert("e"+name+",the"+job);}</script></body>上面的函數會當按鈕被點擊時提示"eBillGates,theCEO"。調用帶參數的函數函數很靈活,您可以使用不同的參數來調用該函數,這樣就會給出不同的消息:<body><p>請點擊其中的一個按鈕,來調用帶參數的函數。</p><buttononclick="myFunction('HarryPotter','Wizard')">點擊這里</button><buttononclick="myFunction('Bob','Builder')">點擊這里</button><script>functionmyFunction(name,job){alert("e"+name+",the"+job);}</script></body>帶有返回值的函數有時,我們會希望函數將值返回調用它的地方。通過使用return語句就可以實現。在使用return語句時,函數會停止執(zhí)行,并返回指定的值。語法functionmyFunction(){varx=5eturnx;}面的函數會返回值5。帶有返回值的函數函數調用將被返回值取代:varmyVar=myFunction();myVar變量的值是5,也就是函數"myFunction()"所返回的值。即使不把它保存為變量,您也可以使用返回值:document.getElementById("demo").innerHTML=myFunction();"demo"元素的innerHTML將成為5,也就是函數"myFunction()"所返回的值。帶有返回值的函數<body><p>本例調用的函數會執(zhí)行一個計算,然后返回結果:</p><pid="demo"></p><script>functionmyFunction(a,b){returna*b;}document.getElementById("demo").innerHTML=myFunction(4,3);</script></body>帶有返回值的函數在您僅僅希望退出函數時,也可使用return語句。返回值是可選的:functionmyFunction(a,b){if(a>b){return;}x=a+b}如果a大于b,則上面的代碼將退出函數,并不會計算a和b的總和。局部JavaScript變量在JavaScript函數內部聲明的變量(使用var)是局部變量,所以只能在函數內部訪問它。(該變量的作用域是局部的)。您可以在不同的函數中使用名稱相同的局部變量,因為只有聲明過該變量的函數才能識別出該變量。只要函數運行完畢,本地變量就會被刪除。全局JavaScript變量在函數外聲明的變量是全局變量,網頁上的所有腳本和函數都能訪問它。JavaScript變量的生存期JavaScript變量的生命期從它們被聲明的時間開始。局部變量會在函數運行以后被刪除。全局變量會在頁面關閉后被刪除。向未聲明的JavaScript變量來分配值如果您把值賦給尚未聲明的變量,該變量將被自動作為全局變量聲明。這條語句:carname="Volvo";將聲明一個全局變量carname,即使它在函數內執(zhí)行。JavaScript運算符運算符=用于賦值。運算符+用于加值。JavaScript運算符運算符=用于給JavaScript變量賦值。算術運算符+用于把值加起來。y=5;z=2;x=y+z;在以上語句執(zhí)行后,x的值是7。JavaScript算術運算符算術運算符用于執(zhí)行變量與/或值之間的算術運算。給定y=5,下面的表格解釋了這些算術運算符:運算符描述例子結果+加x=y+2x=7-減x=y-2x=3*乘x=y*2x=10/除x=y/2x=2.5%求余數(保留整數)x=y%2x=1++累加x=++yx=6--遞減x=--yx=4JavaScript賦值運算符賦值運算符用于給JavaScript變量賦值。給定x=10和y=5,下面的表格解釋了賦值運算符:運算符例子等價于結果=x=yx=5+=x+=yx=x+yx=15-=x-=yx=x-yx=5*=x*=yx=x*yx=50/=x/=yx=x/yx=2%=x%=yx=x%yx=0用于字符串的+運算符+運算符用于把文本值或字符串變量加起來(連接起來)。如需把兩個或多個字符串變量連接起來,請使用+運算符。txt1="Whatavery";txt2="niceday";txt3=txt1+txt2;在以上語句執(zhí)行后,變量txt3包含的值是"Whataveryniceday"。用于字符串的+運算符要想在兩個字符串之間增加空格,需要把空格插入一個字符串之中:txt1="Whatavery";txt2="niceday";txt3=txt1+txt2;或者把空格插入表達式中:txt1="Whatavery";txt2="niceday";txt3=txt1+""+txt2;在以上語句執(zhí)行后,變量txt3包含的值是:"Whataveryniceday"對字符串和數字進行加法運算x=5+5;document.write(x);x="5"+"5";document.write(x);x=5+"5";document.write(x);x="5"+5;document.write(x);規(guī)則是:如果把數字與字符串相加,結果將成為字符串。JavaScript比較和邏輯運算符比較和邏輯運算符用于測試true或false。比較運算符比較運算符在邏輯語句中使用,以測定變量或值是否相等。給定x=5,下面的表格解釋了比較運算符:運算符描述例子==等于x==8為false===全等(

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網頁內容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間,僅對用戶上傳內容的表現方式做保護處理,對用戶上傳分享的文檔內容本身不做任何修改或編輯,并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容,請與我們聯系,我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論