Java Web應用開發(fā)基礎教程課件08-JavaScript_第1頁
Java Web應用開發(fā)基礎教程課件08-JavaScript_第2頁
Java Web應用開發(fā)基礎教程課件08-JavaScript_第3頁
Java Web應用開發(fā)基礎教程課件08-JavaScript_第4頁
Java Web應用開發(fā)基礎教程課件08-JavaScript_第5頁
已閱讀5頁,還剩42頁未讀, 繼續(xù)免費閱讀

下載本文檔

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

文檔簡介

JavaScript第8章JavaScriptJavaScript是一種可直接嵌入網(wǎng)頁文檔中的腳本語言,被設計用來向HTML頁面添加交互行為,讀寫HTML元素,驗證數(shù)據(jù),對事件作出響應。JavaScript是一種基于對象(Object)和事件驅動(EventDriven)并具有安全性能的腳本語言。JavaScript主要用于HTML的頁面,腳本嵌入在HTML的源碼中。另一方面,JavaScript編寫的程序不必在運行前編譯,它們可以直接寫入Web頁面中并由調(diào)用它們的瀏覽器來解釋執(zhí)行。這樣,一些基本交互作用就不用在服務器端完成,提高了客戶端的響應時間。JavaScriptJavaScript的具有如下特點:簡單性:JavaScript是基于Java基本語句和控制流之上的簡單而緊湊的設計,而且,JavaScript的變量類型是采用弱類型,未采用嚴格的數(shù)據(jù)類型。安全性:JavaScript不允許訪問本地硬盤,不能將數(shù)據(jù)存入到服務器上,不允許對網(wǎng)絡文檔進行修改和刪除,只能通過瀏覽器實現(xiàn)信息瀏覽或動態(tài)交互,從而有效的防止數(shù)據(jù)的丟失。JavaScriptJavaScript的具有如下特點:動態(tài)性:Javascript可以直接對用戶或客戶輸入做出響應,無須經(jīng)過web程序。JavaScript對用戶的響應采用以事件驅動的方式進行,即由某種操作動作引起相應的事件響應,如:點擊鼠標、移動窗口、選擇菜單等??缙脚_性:JavaScript依賴于瀏覽器本身,與操作環(huán)境無關。只要能運行瀏覽器的計算機,并安裝了支持JavaScript的瀏覽器就可以正確執(zhí)行,從而實現(xiàn)了“編寫一次,走遍天下”的夢想。JavaScript開發(fā)JavaScript用什么軟件

一個JavaScript程序其實就是一個文檔,一個文本文件,它嵌入到HTML文檔中的,所以,任何可以編寫HTML文檔的軟件都可以用來開發(fā)JavaScript。JavaScript的調(diào)試

Javascript是網(wǎng)頁的前端開發(fā)語言,直接運行在瀏覽器上,一般來講直接在瀏覽器中調(diào)試即可。Javascript的調(diào)試需要相對較多的編程經(jīng)驗,目前還沒有一種非常高效的專用開發(fā)工具。JavaScript語法基礎JavaScript可以出現(xiàn)在HTML的任意地方。使用標記<script>…</script>,你可以在HTML文檔的任意地方插入JavaScript,甚至在<HTML>之前插入也不成問題。如果要在聲明框架的網(wǎng)頁(框架網(wǎng)頁)中插入,就一定要在<frameset>之前插入,否則不會運行。頁面插入JavaScript還有一種方法,就是把JavaScript代碼寫到另一個文件當中(此文件通常應該用“.js”作擴展名),然后用格式為“<scriptsrc="javascript.js"/>”的標記把它嵌入到文檔中即可。JavaScript語法基礎1、執(zhí)行順序JavaScript程序按照在HTML文件中出現(xiàn)的順序逐行執(zhí)行。如果需要在整個HTML文件中執(zhí)行(如函數(shù)、全局變量等),最好將其放在HTML文件的<head>…</head>中。某些代碼,比如函數(shù)體內(nèi)的代碼,不會被立即執(zhí)行,只有當所在的函數(shù)被其他程序調(diào)用時,該代碼被執(zhí)行。JavaScript語法基礎2、標識符JavaScript中標識符用來命名變量和函數(shù),或者用作某些循環(huán)的標記。在JavaScript中,合法的標識符命名規(guī)則和Java以及其他許多語言的命名規(guī)則相同,第一個字符必須是字母、下劃線(-)或美元符號($),其后的字符可以是字母、數(shù)字或下劃線、美元符號。在標識符中數(shù)字不允許作為首字符出現(xiàn),不能和JavaScript中用于其他目的的關鍵字同名。JavaScript是對字母大小寫敏感的。JavaScript語法基礎3、空白符與換行符JavaScript會忽略關鍵字、變量名、數(shù)字、函數(shù)名或其他各種元素實體之間的空格、制表符或換行符,除非這些空格是字符串常量的一部分。由于可以在各種元素實體之間隨意使用空格、制表符或換行符,所以就可以使用整齊、一致的方式自由安排程序布局,在其中使用縮進格式、使代碼容易閱讀和理解。JavaScript語法基礎4、語句與分隔符與Java語言不同,JavaScript并不要求必須以分號“;”作為語句的結束標記。如果語句的結束處沒有分號,JavaScript會自動將該行代碼的結尾作為語句的結尾。例如,下面的兩行代碼都是正確的。 alert("HelloWorld") alert("HelloWorld");注意的是,最好的代碼編寫習慣是在每行代碼的結尾處加上分號,這樣可以保證每行代碼的準確性。JavaScript語法基礎5、塊

語句塊是用大括號“{}”括起來的一個或n個語句。在大括號里邊是幾個語句,但是在大括號外邊,語句塊是被當作一個語句的。語句塊是可以嵌套的,也就是說,一個語句塊里邊可以再包含一個或多個語句塊。JavaScript語法基礎6、關鍵字abstractcontinuefinallyinstanceofprivatethisbooleandefaultfloatintpublicthrowbreakdoforinterfacereturntypeofbytedoublefunctionlongshorttruecaseelsegotonativestaticvarcatchextendsimplementsnewsupervoidcharfalseimportnullswitchwhileclassfinalinpackagesynchronizedwithJavaScript語法基礎7、注釋JavaScript注釋有兩種:單行注釋和多行注釋。單行注釋用雙反斜杠“//”表示。當一行代碼有“//”,那么,“//”后面的部分將被忽略。多行注釋是用“/*”和“*/”括起來的一行到多行文字。程序執(zhí)行到“/*”處,將忽略以后的所有文字,直到出現(xiàn)“*/”為止。JavaScript數(shù)據(jù)類型與變量JavaScript有它自身的基本數(shù)據(jù)類型、表達式和算術運算符以及程序的基本框架結構。JavaScript提供了四種基本的數(shù)據(jù)類型用來處理數(shù)字和文字,而變量提供存放信息的地方,表達式則可以完成較復雜的信息處理。JavaScript的數(shù)據(jù)類型包括:數(shù)值類型、字符串類型、布爾類型、空值類型、未定義值。未定義值即undefined,聲明了變量但未對其進行初始化時賦值。JavaScript數(shù)據(jù)類型與變量關于字符串數(shù)據(jù)類型程序中的字符串型數(shù)據(jù)是包含在單引號或雙引號中的。由單引號定界的字符串中可以含有雙引號,由雙引號定界的字符串中也可以含有單引號,字符串數(shù)據(jù)類型有4種表示方式。單引號內(nèi)出現(xiàn)雙引號或雙引號內(nèi)出現(xiàn)單引號時,不需要進行轉義。但是,如果雙引號內(nèi)出現(xiàn)雙引號或單引號內(nèi)出現(xiàn)單引號,則必須進行轉義。JavaScript數(shù)據(jù)類型與變量關于轉義字符

以反斜杠開頭的不可顯示的特殊字符通常稱為控制字符,也被稱為轉義字符。通過轉義字符可以在字符串中添加不可顯示的特殊字符,或者防止引號匹配混亂。

JavaScript常用的轉義字符如下表所示。轉義字符描述轉義字符描述\b退格\v跳格\n回車換行\(zhòng)r換行\(zhòng)tTab符號\\反斜杠\f換頁\OOO八進制整數(shù),范圍000~777\'單引號\xHH十六進制整數(shù),范圍00~FF\"雙引號\uhhhh十六進制編碼的Unicode字符JavaScript數(shù)據(jù)類型與變量關于未定義值未定義類型的變量是undefined,表示變量還沒有賦值(如vara;),或者賦予一個不存在的屬性值。此外,JavaScript中有一種特殊類型的數(shù)字常量NaN,即“非數(shù)字”。當在程序中由于某種原因發(fā)生計算錯誤后,將產(chǎn)生一個沒有意義的數(shù)字,此時JavaScript返回的數(shù)字值就是NaN。JavaScript數(shù)據(jù)類型與變量關于空值JavaScript中的關鍵字null是一個特殊的值。它表示為空值,用于定義空的或不存在的引用。如果試圖引用一個沒有定義的變量,則返回一個null值。這里必須要注意的是,null不等同于空的字符串("")或0。null與undefined的區(qū)別是,null表示一個變量被賦予了一個空值,而undefined則表示該變量尚未被賦值。JavaScript數(shù)據(jù)類型與變量變量類型規(guī)則:JavaScript是無類型的,其變量可以存放任何數(shù)據(jù)類型的值。在JavaScript當中,可以把一個數(shù)值賦給一個變量,然后再用一個字符串對其賦值。 i=10; i=“ten”;JavaScript數(shù)據(jù)類型與變量變量聲明變量:JavaScript中變量的聲明不是必須的,但最好先聲明再使用,可用關鍵字

var來聲明變量。

可以使用一個關鍵字var同時聲明多個變量

可以在聲明的同時對其賦值

如果只聲明未賦值,則其值為undefinedvar語句可以用作for循環(huán)和for循環(huán)的一部分

可以使用var語句多次聲明同一變量,其作用相當于重新賦值JavaScript數(shù)據(jù)類型與變量變量變量命名:JavaScript中變量命名第一個字符必須是字母或下劃線;并且變量名中不可包含空格以及!、@、#、$、等特殊字符;變量名大小寫敏感。作用范圍:變量可分為全局變量和局部變量:

全局變量在整個程序中存在

在函數(shù)內(nèi)部定義的變量只在函數(shù)內(nèi)起作用例子:example8_1.htmlJavaScript數(shù)據(jù)類型與變量算術運算符

+-*/

%-++--賦值運算符 =關系運算符

<<=>>======!=!==邏輯運算符

&&||!字符串運算符+

例子:example8_2.htmlJavaScript流程控制語句語句(分號不是必須的)表達式語句條件語句:if……else……多路分支語句:switch……case……循環(huán)語句:while循環(huán)語句:do……while循環(huán)語句:for退出循環(huán):break、continueJavaScript函數(shù)函數(shù):function函數(shù)名(參數(shù)表)

{

函數(shù)體}函數(shù)可以有一個返回值,有返回值的函數(shù)可以作為表達式使用。在函數(shù)外定義的變量為全局變量在函數(shù)內(nèi)定義的變量使用了var修飾為局部變量在函數(shù)內(nèi)定義的變量沒有用var修飾為全局變量

例子:example8_3.html

例子:example8_4.htmlJavaScript對象對象(Object)是JavaScript中最重要的一種數(shù)據(jù)類型,一個對象中可包含若干屬性和方法。屬性相當于一種變量,有些屬性有初始值,可以通過它們獲取對象的參數(shù),有些屬性是只讀的,這種屬性可作為常量使用。引用對象屬性的方法是:

對象名.屬性名

方法相當于函數(shù),可以調(diào)用對象的方法來實現(xiàn)相應操作。引用對象方法的方法是:

對象名.方法名(參數(shù))JavaScript對象JavaScript對象字符串對象:JavaScript的String對象是文本值的包裝器。除了存儲文本,String對象包含一個屬性和各種方法來操作或收集有關文本的信息。與Boolean對象類似,String對象不需要進行實例化便能夠使用。例如,您可以將一個變量設置為一個字符串,然后String對象的所有屬性或方法都可用于該變量。String對象只有一個屬性,即length,它是只讀的。length屬性可用于只返回字符串的長度,不能在外部修改它 例子:example8_5.htmlJavaScript對象算術函數(shù)Math對象:JavaScript的Math對象提供對數(shù)據(jù)的數(shù)學計算。例子:

example8_6.htmlabs(x)返回x的絕對值acos(x)返回x的反余弦值(余弦值等于x的角度),用弧度表示。asin(x)返回x的反正弦值。atan(x)返回x的反正切值。ceil(x)返回大于等于x的最小整數(shù)。cos(x)返回x的余弦。exp(x)返回e的x次冪(ex)。floor(x)返回小于等于x的最大整數(shù)。log(x)返回x的自然對數(shù)(lnx)。max(a,b)返回a,b中較大的數(shù)。min(a,b)返回a,b中較小的數(shù)。pow(n,m)返回n的m次冪(nm)。random()返回大于0小于1的一個隨機數(shù)。round(x)返回x四舍五入后的值。sin(x)返回x的正弦。sqrt(x)返回x的平方根。tan(x)返回x的正切。JavaScript對象日期及時間對象:Date日期對象可以儲存任意一個日期,從0001年到9999年,并且可以精確到毫秒數(shù)(1/1000秒)。在內(nèi)部,日期對象是一個整數(shù),它是從1970年1月1日零時正開始計算到日期對象所指的日期的毫秒數(shù)。如果所指日期比1970年早,則它是一個負數(shù)。所有日期時間,如果不指定時區(qū),都采用“UTC”(世界時)時區(qū),它與“GMT”(格林威治時間)在數(shù)值上是一樣的。Date對象有很多的“get/set[UTC]XXX()”這樣的方法,它表示既有getXXX()方法,又有setXXX()方法。

例子:example8_7.htmlJavaScript對象JavaScript中的系統(tǒng)函數(shù)JavaScript中的系統(tǒng)函數(shù)又稱內(nèi)部方法。它提供了與任何對象無關的系統(tǒng)函數(shù),使用這些函數(shù)不需創(chuàng)建任何實例就可以直接使用。下面給出幾個系統(tǒng)函數(shù)的說明:1、eval(字符串表達式):返回字符串表達式中的值2、unEscape(String):返回字符串ASCII碼3、escape(character):返回字符的編碼4、parseFloat(floustring):返回實數(shù)5、parseInt(numbestring,radix):返回不同進制的數(shù),radix是數(shù)的進制

例子:example8_8.html瀏覽器對象系統(tǒng)瀏覽器對象系統(tǒng)窗口對象:Window對象表示瀏覽器中打開的窗口。如果文檔包含框架(frame或iframe標簽),瀏覽器會為html文檔創(chuàng)建一個window對象,并為每個框架創(chuàng)建一個額外的window對象。窗口對象的事件驅動 窗口對象主要有裝入Web文檔事件onLoad和卸載時onUnload事件。用于文檔載入和停止載入時觸發(fā)相關函數(shù)的執(zhí)行。瀏覽器對象系統(tǒng)窗口對象的方法使用window.open(URL,name,features,replace)方法來創(chuàng)建新的窗口。alert()方法能創(chuàng)建一個具有OK按鈕的對話框。confirm()方法為編程人員提供一個具有兩個按鈕的對話框。prompt()方法允許用戶在對話框中輸入信息,并可使用默認值,其基本格式如下prompt(“提示信息”,默認值)。瀏覽器對象系統(tǒng)窗口對象中的屬性frames:確定文檔中幀的數(shù)目parent:指明當前窗口或幀的父窗口defaultstatus:默認狀態(tài),值顯示在窗口的狀態(tài)欄中status:包含文檔窗口中幀中的當前信息top:包括的是用以實現(xiàn)所有的下級窗口的窗口window:指的是當前窗口self:引用當前窗口。瀏覽器對象系統(tǒng)Location對象:包含了當前頁面的地址(URL)信息,可以直接改變此屬性值,將其設置成新的地址(URL): window.location=""; 或者

location=""; 例子:example8_9.html瀏覽器對象系統(tǒng)Location對象還可以通過下面兩種方法中的任何一種來使瀏覽器從服務器上Load頁面:reload()-促使瀏覽器重新下載當前的頁面,也就是“刷新”當前頁面。replace(URL)-促使瀏覽器根據(jù)URL參數(shù)中給出的地址(URL)下載頁面,同時在當前瀏覽器存儲的歷史記錄(即所瀏覽過的頁面的列表)中使用新的地址(即此方法中的URL參數(shù))覆蓋當前的頁面。瀏覽器對象系統(tǒng)history對象:記錄瀏覽器所瀏覽過的每一個頁面,這些頁面組成了一個歷史記錄列表。forward()-將歷史記錄向前移動一個頁面;back()-將歷史記錄向后移動一個頁面;go()–控制歷史紀錄,參數(shù)值可以是正負整數(shù)、零和字符串,例如history.go(-2)將是當前頁后退兩頁;如果給定的參數(shù)是字符串,那么瀏覽器就會搜索列表,找到最接近當前頁面位置的并且地址URL中含有此字符串的頁面,然后轉到該頁面。 例子:example8_10.html、example8_11.html瀏覽器對象系統(tǒng)Document對象是核心也是最重要的,其中又包括3個主要的對象:Anchor:<a>元素中name屬性產(chǎn)生的對象Link:<a>元素中href屬性產(chǎn)生的對象Form:<form>元素對象對于頁面中存在的多個form可以使用數(shù)組來進行操作,在某些情況下比使用id更為方便:例子:example8_12.html幾個例子JavaScript之皮膚更換

例子:example8_13.html、css1.css、css2.cssJavaScript之顏色變更——函數(shù)傳參

例子:example8_14.htmlJavaScript之顏色變更——多參數(shù)傳遞

例子:example8_15.htmlJavaScript事件處理事件處理是對象化編程的一個很重要的環(huán)節(jié),沒有了事件處理,程序就會變得很死,缺乏靈活性。事件處理的過程可以這樣表示:發(fā)生事件-啟動事件處理程序-事件處理程序作出反應。其中,要使事件處理程序能夠啟動,必須先告訴對象,如果發(fā)生了什么事情,要啟動什么處理程序,否則這個流程就不能進行下去。事件的處理程序可以是任意JavaScript語句,但是我們一般用特定的自定義函數(shù)(function)來處理事件。JavaScript事件處理常見的JavaScript事件如下:1、onblur事件:發(fā)生在窗口失去焦點的時候。2、onchange事件:發(fā)生在文本輸入?yún)^(qū)的內(nèi)容被更改,然后焦點從文本輸入?yún)^(qū)移走之后。3、onclick事件:發(fā)生在對象被單擊的時候。4、onerror事件:發(fā)生在錯誤發(fā)生的時候。5、onfocus事件:發(fā)生在窗口得到焦點的時候。6、onload事件:發(fā)生在文檔全部下載完畢的時候。7、onmousedown事件:發(fā)生在用戶把鼠標放在對象上按下鼠標鍵的時候。

溫馨提示

  • 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. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論