第七章 網(wǎng)頁中使用JavaScript_第1頁
第七章 網(wǎng)頁中使用JavaScript_第2頁
第七章 網(wǎng)頁中使用JavaScript_第3頁
第七章 網(wǎng)頁中使用JavaScript_第4頁
第七章 網(wǎng)頁中使用JavaScript_第5頁
已閱讀5頁,還剩52頁未讀, 繼續(xù)免費閱讀

下載本文檔

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

文檔簡介

1、第七章第七章網(wǎng)頁中使用網(wǎng)頁中使用JavaScript 本課知識點本課知識點pJavaScript中的概念,如對象、事件等中的概念,如對象、事件等pJavaScript類型和變量類型和變量p 熟悉各種語句熟悉各種語句p 掌握內(nèi)置對象和函數(shù)掌握內(nèi)置對象和函數(shù) p 掌握各種事件掌握各種事件7.1JavaScriptJavaScript中的數(shù)據(jù)類型與變量中的數(shù)據(jù)類型與變量數(shù)據(jù)類型數(shù)據(jù)類型 JavaScript主要的數(shù)據(jù)類型有:數(shù)值類型(number)、字符串型(String)、對象類型(object)、布爾類型(Boolean)、空類型(null)。 1數(shù)值類型 在JavaScript 中數(shù)值類型可代

2、表整數(shù)和浮點數(shù)。整數(shù)可以為正數(shù)、0 或者負數(shù)。浮點數(shù)通常是科學記數(shù)法,如1.6E10(E大小寫均可)代表1.61010。 2字符串類型 字符串類型是用引號括起來的一組字符。如:“happy birthday to you ” 3對象類型 因為JavaScript是一種基于對象的語言,所以在JavaScript中還有對象類型,比如以后將會講到的windows對象等。 4布爾類型 布爾類型用于邏輯運算,一個布爾類型的變量可能的取值有 true 和 false。 5空數(shù)據(jù)類型 空數(shù)據(jù)類型就是null,也就是沒有任何值,什么也不表示。 7.1JavaScriptJavaScript中的數(shù)據(jù)類型與變量中

3、的數(shù)據(jù)類型與變量變量變量 在 JavaScript 中,變量用來存放腳本中的值,在需要用這個值的地方可以用變量來代表。JavaScript語言不像其他語言那樣對數(shù)據(jù)類型要求嚴格,所以不必聲明每一個變量的類型。雖然變量聲明不是必須的,但在使用變量之前先進行聲明是個好習慣。變量聲明使用 var 語句進行。 如:var student= false; / 變量student 的數(shù)據(jù)類型為Boolean 類型。 另外,在定義變量名時必須遵循以下規(guī)則: 1. 第一個字符必須以字母(大小寫均可)、或下劃線、或美元符$開始。例如_md和md都是合法的變量名稱。而2md和md都是非法的。 2. 變量名中不能包

4、含空格。例如 text name就是不合法的變量名。 3. 變量名稱不能是保留字。例如var是JavaScript中定義變量的保留字,在給變量起名字的時候就不能使用var。 4. 變量名區(qū)分大小寫。JavaScript 是一種區(qū)分大小寫的語言,將一個變量命名為 name 和將其命名為 Name是不一樣的。 另外,對象名必須大寫,方法名和屬性名大小寫均可。JavaScript支持/注釋符。 7.2客戶端腳本客戶端腳本1. 1. 客戶端腳本客戶端腳本表單接受到的信息一般都是提交到服務端來進行驗證和處理。一般對于一個新用戶的數(shù)據(jù),處理的順序為先校驗數(shù)據(jù)的合法性,數(shù)據(jù)不合法就需要返還客戶端要求用戶重新

5、填寫,合法后才進一步處理。這樣的校驗數(shù)據(jù)和數(shù)據(jù)反復既浪費了服務器的寶貴資源又浪費了客戶的時間,同時也增加了客戶信息泄露的危險。所以我們可以在客戶端通過簡單的,對客戶開放的腳本代碼方式,對用戶信息進行規(guī)范,如用戶名和密碼不能一樣,電子郵件的填寫一定要是郵件地址格式和身份證號碼長度等問題。這樣不但可以及時的提醒用戶規(guī)范填寫,減輕服務器的負擔,而且程序的運行是在客戶端上,不會對服務器造成任何的不利影響。 JavaScript是一種基于對象(Object)和事件驅動(Event Driven)的腳本語言。使用它的目的是與HTML超文本標記語言、Java 腳本語言(Java小程序)一起實現(xiàn)在一個Web頁

6、面中鏈接多個對象,與Web客戶交互作用。從而可以開發(fā)客戶端的應用程序等。它是通過嵌入或調入在標準的HTML語言中實現(xiàn)的。 2. JavaScript2. JavaScript簡介簡介3. JavaScript3. JavaScript實例實例通過通過Dreamweaver MXDreamweaver MX建立一個空白的網(wǎng)頁,切換到代碼建立一個空白的網(wǎng)頁,切換到代碼視圖下,在視圖下,在標記之間添加入如下代碼:標記之間添加入如下代碼:alert(alert(這是第一個這是第一個JavaScriptJavaScript例子例子!);!);alert(alert(歡迎你進入歡迎你進入JavaScrip

7、tJavaScript世界世界!);!);alert(alert(今后我們將共同學習今后我們將共同學習JavaScriptJavaScript知識!知識!););說明:說明:JavaScriptJavaScript代碼由代碼由來說明。來說明。在標識在標識.之間就可加入之間就可加入JavaScriptJavaScript腳本。腳本。LanguageLanguage是是標記的參數(shù),用來指定腳本所使用的語言,如果使標記的參數(shù),用來指定腳本所使用的語言,如果使用的是用的是VBScriptVBScript,則使用,則使用alert()alert()是是JavaScriptJavaScript的消息對話框

8、事件,其功能是彈出一個具有的消息對話框事件,其功能是彈出一個具有OKOK對對話框并顯示()中的字符串。話框并顯示()中的字符串。通過通過標識說明:若不認識標識說明:若不認識JavaScript代碼的瀏覽器代碼的瀏覽器,則所有在其中的標識均被忽略;若認識,則執(zhí)行其結果。,則所有在其中的標識均被忽略;若認識,則執(zhí)行其結果。使用注釋這是一個好的編程習慣,它使其他人可以讀懂你的使用注釋這是一個好的編程習慣,它使其他人可以讀懂你的語言。語言。7.2JavaScriptJavaScript的語言結構的語言結構ifif條件語句條件語句 ifelse 語句是JavaScript中最基本的控制語句,通過它可以改

9、變語句的執(zhí)行順序。if條件語句的基本格式是:if(表述式)語句段;else語句段; 功能:如果條件滿足,即表達式為true,則執(zhí)行語句段,否則執(zhí)行語句段。如果語句段1和語句段2中只有一條語句,兩邊的花括號可以省去,如果有多條語句,則必須使用花括號將其括起來。If條件語句中的else部分可以省去,如果省去,當條件滿足時執(zhí)行語句段1,如果不滿足,就什么也不做。if必須小寫。7.2JavaScriptJavaScript的語言結構的語言結構ifif條件語句條件語句 if語句是可以嵌套的。格式為:if(表達式1)語句段;else(表達式2)語句段;else if(表達式3)語句段;else 語句段n;

10、 在這種情況下,若表達式1為真,則執(zhí)行語句段1,否則,若表達式2為真,則執(zhí)行語句段2。若表達式2為假,則看表達式3是否為真,若為真,則執(zhí)行語句段3。依次下去,直到遇到條件為真,轉去執(zhí)行相應的語句段。若前面的條件都假,則執(zhí)行最后的else語句。7.2JavaScriptJavaScript的語言結構的語言結構switchswitch條件語句條件語句 Switch語句格式如下:switch (表達式)case 常量表達式1:語句段1;case 常量表達式2: 語句段2;case 常量表達式3: 語句段3;default:語句段n; switch語句是多分支選擇語句,雖然這個功能可用嵌套的if語句來

11、實現(xiàn),但如果分支較多則嵌套的if語句層數(shù)就多,增加了程序的長度并降低了可讀性。此時用Switch語句是較好的選擇。說明:switch后面的表達式,可以是字符型表達式或整型表達式。當表達式的值與常量表達式m的值相等時就執(zhí)行語句段m。若沒有與它匹配的常量表達式,則執(zhí)行default后面的語句段。7.2JavaScriptJavaScript的語言結構的語言結構switchswitch條件語句條件語句 switch (表達式)case 常量表達式1:語句段1;break;case常量表達式2: 語句段2;break;case常量表達式3: 語句段3;break;default:語句段n; 要 注 意

12、 的 一 點 是 : 在switch語句中如果找到常量表達式m的值和表達式的值相等,程序就會從語句段m一直執(zhí)行下去,而不再判斷與后面常量表達式的值是否匹配。所以要想讓程序只執(zhí)行相應的語句段,應該在相應語句段后加上break語句。格式為: 7.2JavaScriptJavaScript的語言結構的語言結構ForFor循環(huán)語句循環(huán)語句 如果一個語句段需要反復使用多次,用循環(huán)語句編寫代碼。For語句基本格式是: for(初始化部分;條件部分;增量部分) 語句段 說明:語句的初始化部分是可選的,若在該語句外初始化變量,則該部分可省去。執(zhí)行for語句時,首先判斷條件是否成立,若成立則執(zhí)行語句段,接著執(zhí)行

13、增量部分,否則跳出循環(huán)語句。增量部分用來定義循環(huán)控制變量在每次循環(huán)時按什么方式變化。7.2JavaScriptJavaScript的語言結構的語言結構whilewhile和和dodowhilewhile循環(huán)語句循環(huán)語句 For與while語句都是循環(huán)語句,使用For語句在處理有關數(shù)字時更易看懂,也較緊湊,而while循環(huán)對復雜的語句效果更特別。 1while循環(huán)語句基本格式是:while(循環(huán)條件) 語句段; 當循環(huán)條件為真時,重復執(zhí)行語句段,否則退出循環(huán)。 2dowhile循環(huán)語句的基本格式是:do 語句段; while (循環(huán)條件) dowhile循環(huán)語句不管循環(huán)條件是否成立,都會先執(zhí)行一

14、次循環(huán),然后判斷條件是否成立。若成立,繼續(xù)執(zhí)行語句段,否則跳出循環(huán)。也就是說dowhile循環(huán)語句中的語句段至少執(zhí)行一次。 使用break語句可使得循環(huán)從For、while或switch語句中跳出。使用Continue語句是結束當前的循環(huán),進入下一次循環(huán)。 7.2JavaScriptJavaScript的語言結構的語言結構函數(shù)定義語句函數(shù)定義語句 函數(shù)是能夠完成某種功能的語句集合。通常在一個復雜的程序設計時,總是根據(jù)所要完成的功能,將程序劃分為一些相對獨立的部分,每部分編寫一個函數(shù)。JavaScript函數(shù)定義語句的格式是: Function 函數(shù)名 (參數(shù)表)函數(shù)體(函數(shù)執(zhí)行部分); Ret

15、urn 表達式; 說明:return語句指明函數(shù)返回值,如無返回值,可以不使用return語句。 從語句格式中可以看出,函數(shù)定義由三部分組成: 1函數(shù)名。在對函數(shù)進行命名時,應該使函數(shù)的名稱有一定含義,能夠表達函數(shù)功能。函數(shù)名區(qū)分大小寫。對函數(shù)的調用通過函數(shù)名進行。 2參數(shù)列表。參數(shù)列表是可選部分,使用參數(shù)列表可以向函數(shù)傳遞參數(shù),這些 參 數(shù) 在 函 數(shù) 中 使 用 , 其 值 可 以 是 常 量 、 變 量 、 表 達 式 。 可 通 過arguments .Length來檢查參數(shù)的個數(shù)。例如,要看函數(shù)square的參數(shù)個數(shù),并把個數(shù)賦給變量n,可以這樣寫:n=square. argumen

16、ts .Length。 3大括號 部分。函數(shù)的功能通過執(zhí)行大括號中代碼塊來實現(xiàn)。7.2JavaScriptJavaScript的語言結構的語言結構withwith語句語句和和注釋語句注釋語句 with語句的基本格式是: with(對象名稱) 語句段 要引用對象的方法和屬性時必須使用對象對象.方法方法或者是對象對象.屬性屬性,比較麻煩,with語句可解決這個問題。直接使用with語句聲明對象的屬性和方法,當聲明內(nèi)容較多時特別方便。要引用string對象的charAt(n)方法,完整的引用代碼為string.charAt(n)。在with語句內(nèi)使用string對象的charAt(n)方法代碼為:w

17、ith(string)charAt(n); 在JavaScript中為了描述程序的作用可以使用注釋語句。注釋語句只是用來給人看的,而不是用來執(zhí)行的。在JavaScript中有兩種形式的注釋:1在一行中跟在“/”后面的是注釋語句。 2如果注釋語句有好幾行,可以使用符號/*和*/來標注注釋。 7.3JavaScriptJavaScript中的對象中的對象基本概念基本概念 在日常生活中我們會接觸到各種各樣的對象,例如,一個蘋果是一個對象,一個房間是一個對象,一輛汽車也是一個對象。蘋果有大有小,有紅有綠,房間有高有矮,這些就是對象的屬性。一輛汽車能夠完成加速、減速、轉彎等功能,從對象的角度看這就是對象

18、的方法。 在編程中,“對象”是一個特殊類型的數(shù)據(jù),前面講過JavaScript的數(shù)據(jù)類型,其中有一類就是對象類型?!胺椒ā笔羌釉趯ο笊系囊恍┎僮?,是一個對象自己所屬的函數(shù)。網(wǎng)頁中的按鈕、復選框等都是對象,而按鈕的顏色、長度、寬度就是它的屬性,釋放按鈕的焦點可以用方法blur()。在JavaScript中訪問對象的屬性或方法可用句點“.”來實現(xiàn)。例如,用Apple對象代表一個蘋果,在Apple對象中有Color屬性代表蘋果的顏色,可以通過Apple.Color訪問對象的Color屬性。7.3JavaScriptJavaScript中的對象中的對象創(chuàng)建新的對象創(chuàng)建新的對象 JavaScript中除

19、了使用一些定義好的對象,比如按鈕,復選框等,還可以創(chuàng)建自己的對象。在JavaScript中創(chuàng)建一個新的對象需要三個步驟: 第1歩:定義對象的構造函數(shù)用來說明這個對象的各種屬性。 第2歩:通過new函數(shù)創(chuàng)建對象的實例。 第3歩:定義對象的方法,并把這些方法和對象聯(lián)系起來。 1定義對象的構造函數(shù) 在JavaScript中定義對象的構造函數(shù)基本格式是: Function 構造函數(shù)名(對象名)(參數(shù)1,參數(shù)2,參數(shù)3,) This.屬性1=參數(shù)1 This.屬性2=參數(shù)2 . 7.3JavaScriptJavaScript中的對象中的對象創(chuàng)建新的對象創(chuàng)建新的對象 在構造函數(shù)中通過this操作符(thi

20、s指對象本身)引用當前對象,函數(shù)中有多個參數(shù),當調用這個構造函數(shù)時就創(chuàng)建了一個對象,并把參數(shù)值賦給這個對象的屬性。在定義了對象的構造函數(shù)之后,可以用new操作符創(chuàng)建對象的實例。2定義對象的方法 “方法”是加在對象上的操作,是一個對象自己所屬的函數(shù)。定義方法和定義普通的函數(shù)并沒有什么區(qū)別,只是在定義完方法之后,還需要將方法與對象聯(lián)系起來。將方法與對象聯(lián)系起來:對象.方法的名字=函數(shù)的名字 例如,在程序中定義了一個普通函數(shù)showstudent,現(xiàn)在要把它定義為上面創(chuàng)建的對象student的方法,可表示為:student.showstudent=showstudent,一旦定義完對象的方法,原來的

21、函數(shù)就不再是普通的函數(shù),要這樣使用它:對象.方法名字(參數(shù)表) 也可以在定義對象的構造函數(shù)時定義方法。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù) 通常把程序設計的一些常用部件(相關元素組織包裝起來稱為“部件”)設計成內(nèi)置對象和函數(shù)。這些內(nèi)置對象同我們自己定義的對象一樣,也擁有自己的屬性和方法。內(nèi)置對象提供編程中最常用的功能,例如字符串處理、時間處理等。內(nèi)置函數(shù)簡單一點說就是把一些常用的函數(shù)編寫好封裝在語言的內(nèi)部,用戶使用時直接調用就可以了。主要的內(nèi)置函數(shù)是一些數(shù)據(jù)類型轉換函數(shù)。下面介紹 JavaScri

22、pt的幾個常用內(nèi)置對象。 1字符串對象(String) String對象是用來處理字符串的。因為String對象與JavaScript語言本身結合非常緊密,所以在創(chuàng)建對象實例時可以不使用new操作符。 例如創(chuàng)建對象實例string1,下面兩種寫法效果是一樣的: var string1=happy birthday to you .; var string1=new string(happy birthday to you);字符串的長度可以用String對象中l(wèi)ength屬性給出。例如string1.length可求出字符串string1的長度。 7.3JavaScriptJavaScript

23、中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù) 對字符串的處理是用方法來實現(xiàn)的。常用方法有: 1)toLowerCase()和toUpperCase()方法 toLowerCase()方法將字符串中的字母全部轉換成小寫,toUpperCase()方法將字符串中的字母全部轉換成大寫。 2)charAt(n)方法 charAt(n)方法從字符串對象中返回指定位置n處的字符。注意:這里的位置從0開始計算 。 3)indexOf(子字符串)方法 indexOf(子字符串)返回子字符串在字符串對象中的位置。若在字符串對象中有多個這樣的子字串,只返回第一個字符串所

24、在位置。如果不存在這樣的子字串,則返回-1。 4)lastIndexOf(子字符串)方法 astIndexOf(子字符串)方法也是返回子字符串在字符串對象中的位置,只不過該方法是從字符串對象的右邊開始查找,若找不到同樣返回-1。 7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù) 5)Substring(m,n)方法 Substring(m,n)方法返回從位置m到位置n之間的字符串。注意:返回的字符串中不包括位置n處的字符。 6)字符串格式化的方法 big()方法:該方法使字符串以大字號顯示。 small()方

25、法:該方法使字符串以小字號顯示。 blink()方法:該方法使字符串閃爍。 bold()方法:該方法使字符串以黑體顯示。 italics()方法:該方法使字符串以斜體顯示。 fixed()方法:該方法使字符串顯示成等寬字。 strike()方法:該方法給字符串加上刪除線。 sub() 和sup()方法:分別使字符串以下標和上標的形式顯示。 fontcolor(顏色)方法:該方法用于指定字符串顯示的顏色。 fontsize(字號)方法:該方法用于指定字符串的大小。 7)用于鏈接的方法 在HTML中我們學過鏈接標記,在JavaScript中是用link(url)方法和anchor方法實現(xiàn)的。lin

26、k(url)方法等效于HTML中標記的href屬性。anchor方法等效于HTML中標記的NAME屬性。 7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù) 2數(shù)組對象(Array) 注意:數(shù)組下標從0開始。 定義數(shù)組可以采用以下三種方法: (1)定義一個未知大小的數(shù)組:var s=new Array(); (2)建立數(shù)組時定義數(shù)組的長度,例如,定義一個含有3個元素的woman數(shù)組,格式為:var woman=new Array(3); (3)建立數(shù)組的同時,給數(shù)組中的元素賦值。例如,定義一個woman數(shù)組,其

27、中的值分別為Jony、Mary、Angle。建立數(shù)組的格式為: var woman=new Array(Jony, Mary , Angle ); 訪問woman數(shù)組的第二個元素:woman1= Mary ; 數(shù)組也是對象,有屬性和方法。判斷數(shù)組的大?。ㄩL度)可以用屬性length。例如要判斷上面定義的數(shù)組woman的長度,可以用格式:woman.length,返回值為3。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù) 下面介紹Array對象的幾種常用方法: (1)sort()方法 sort()方法將數(shù)組元

28、素排序。默認按照ASCII碼升序。woman.sort(); 格式能對上面定義的woman數(shù)組排序,排序后數(shù)組元素依次是: Angle 、Jony、 Mary 。 (2)join(參數(shù))方法 join(參數(shù))方法將數(shù)組中的所有元素值以一個字符串的形式表達出來,顯示數(shù)組中所有的元素值可以用該方法。Join()方法有一個參數(shù),用該參數(shù)指出每個元素之間使用的分隔符號,若省略,則元素之間沒有分隔。 (3)reverse()方法 reverse()方法將數(shù)組中的元素顛倒順序,將數(shù)組中最后一個元素換到第一個元素的位置,倒數(shù)第二個元素換到第二個元素的位置.例如定義一個woman數(shù)組,然后讓數(shù)組中的元素循序顛

29、倒:7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù) (4)pop()方法 用這個方法可以刪除數(shù)組中的最后一個元素,并且返回這個元素。 (5)contat(數(shù)組名) 用這個方法可以把兩個數(shù)組的內(nèi)容合并起來。 (6)slice(下標1,下標2) 方法 用這個方法可以獲得數(shù)組中的一部分元素,這部分元素是從下標1開始,到下標2結束(不包含下標2)。下標2是可選的,如果沒有指出下標2,則表示截取從下標1開始直到數(shù)組末尾的元素。如果這個參數(shù)是負數(shù),例如是-3,表示一直截取到數(shù)組的倒數(shù)第三個元素。 (7)push(元素)

30、 方法 用這個方法可以在數(shù)組的最后加入一個元素。例如: var woman=new Array(Jony, Mary , Angle ); woman.push(Jone); 這樣可以在數(shù)組woman的后面加上Jone元素。 7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù) 3日期對象(Date) 與日期有關的所有內(nèi)容在該對象中都可以找到。日期對象沒有屬性,但是日期對象有很多方法,通過這些方法可以獲得時間或設置時間。 創(chuàng)建一個日期對象的實例有三種方式: (1)MyDate=New Date(),用這種方式創(chuàng)建

31、的對象實例自動存儲了當前日期和時間。 (2)MyDate= New Date(毫秒數(shù)),該方法中的“毫秒數(shù)”表示從1970年1月1日0點0時開始到一個指定日期的毫秒數(shù)。用這種形式創(chuàng)建的日期對象,日期會自動存儲在新創(chuàng)建的對象實例中。JavaScript語言內(nèi)部存儲了自從1970年1月1日開始到指定日期的毫秒數(shù)。 (3)MyDate= New Date(year,month,date,hours,minutes,seconds),用這種方法創(chuàng)建對象實例時可以指定日期對象的時間。日期對象中所有小時、秒數(shù)、日期、月份等的數(shù)字都是從0開始的,年份從1900年開始。 7.3JavaScriptJavaSc

32、ript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù) 日期對象的方法:(1)獲得日期對象各個部分的方法getYear() 獲得日期對象的年份getMonth() 獲得日期對象的月份getDate() 獲得日期對象的日號數(shù)getDay() 返回星期幾getHours() 獲得日期對象的小時數(shù)getMintes() 獲得日期對象的分鐘數(shù)getSeconds() 獲得日期對象的秒數(shù)getTime() 獲得日期對象的時間(以毫秒數(shù)計算)。(2)設置日期對象的各個部分的方法:setYear() 設置日期對象的年份setMonth() 設置日期對象的月份數(shù)set

33、Date() 設置日期對象的日號數(shù)setHours() 設置日期對象的小時數(shù)setMintes() 設置日期對象的分鐘數(shù)setSeconds() 設置日期對象的秒數(shù)setTime() 設置日期對象的毫秒數(shù), 在以后的計算中就可以將這個日期對 象的各個部分取出分別處理。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù)(3)處理時區(qū)問題的方法 getTimeZoneOffset() 給出當?shù)貢r區(qū)與GMT(格林威治標準時間,也叫UTC)的偏差。 toGMString() 轉換成以格林威治標準時間表達的字符串。 to

34、Local String() 轉換成以當?shù)貢r間方式表達的時間字符串。 (4)處理日期格式之間轉換的方法 Date對象有兩種特殊的方法可用于日期格式之間的轉換。這不是某個單獨的Date對象的方法,它可以作用于Date對象本身,是Date對象定義的靜態(tài)方法,靜態(tài)方法同每個具體的實例是沒有關系的。這兩種方法是: Date.Parse(字符串) 這個方法把一個字符串表達的時間或日期轉換成時間或日期的內(nèi)部表示(距1970年1月1日的毫秒數(shù))。例如: Date1=new date(); Date1. setTime (Date.parse(May 1,2004); 使Date1這個對象實例存放了日期200

35、4年5月1日。 Date.UTC(日期) 這個方法返回從1970年1月1日到給定日期的毫秒數(shù)。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù) 4數(shù)學對象(Math) Math對象可用來處理各種數(shù)學運算,Math對象不能創(chuàng)建自己的對象實例??梢灾苯邮褂肕ath來調用常用的數(shù)學函數(shù),格式為:Math.數(shù)學函數(shù)名(參數(shù)) 注意:所有Math對象方法中的參數(shù)均是浮點型。在三角函數(shù)里,輸入的是弧度值。 數(shù)學函數(shù)名前加上Math.可能使用起來不太習慣,我們可以使用前面介紹的with語句指定Math對象,在Math對象的

36、作用范圍內(nèi)直接使用數(shù)學函數(shù)就可以了。格式如下: with(Math)各種數(shù)學函數(shù) Math對象的常用函數(shù): (1)三角函數(shù) Sin(弧度值):對弧度值進行正弦計算,返回該弧度值的正弦值。 Cos(弧度值):對弧度值進行余弦計算,返回該弧度值的余弦值。 Tan(弧度值):對弧度值進行正切計算,返回該弧度值的正切值。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù) Asin(數(shù)值):反正弦函數(shù),求數(shù)值的反正弦函數(shù)值。 Acos(數(shù)值):反余弦函數(shù),求數(shù)值的反余弦函數(shù)值。 Atan(數(shù)值):反正切函數(shù),求數(shù)值的反正

37、切函數(shù)。(2)取整函數(shù) ceil(a):向上取整函數(shù),返回一個不小于a的最小整數(shù)。例如ceil(3.3)的返回值為4。 Floor(a):向下取整函數(shù),返回一個不大于a的最大整數(shù)。例如Floor(3.3)的返回3。 Round(a):對a四舍五入取整。如:Round(3.5)返回值為4。Round(3.4)返回值為3。(3)指數(shù)、對數(shù)函數(shù) Exp(a):返回e的a次冪的值。 Log(a):返回a的自然對數(shù)值。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù)(4)乘冪函數(shù) Pow(a,b):計算a的b次冪的值,

38、即ab。 Sqrt(a):對a進行求平方根的計算。(5)其他函數(shù) abs(a):對a取絕對值,例如:Math.abs(-2),結果為2。 Random():隨機函數(shù),該函數(shù)能夠產(chǎn)生0-1之間的一個隨機數(shù)。 Max(a,b):取最大值的函數(shù),取a和b中最大的一個。 Min(a,b):取最小值的函數(shù),取a和b中最小的一個。 Math對象還包含屬性,屬性都是一些公認的常數(shù)值。Math對象的屬性: 屬性E:自然對數(shù)的底,即2.71828。屬性LN2:2的自然對數(shù)值,即0.69315。 屬性LN10:10的自然對數(shù)值,即2.30259。屬性PI:圓周率,即3.1415926。屬性SQRT1_2:0.5的

39、平方根。屬性SQRT2:2的平方根。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù) 5事件對象(Event) 事件對象描述一個JavaScript中的事件。在每個事件發(fā)生時,JavaScript解釋器會自動填充一個事件對象實例,并作為一個參數(shù)傳送給事件處理函數(shù)。例如mousedown事件,在該事件發(fā)生時會產(chǎn)生鼠標在哪個位置、鼠標的哪個按鈕被按下、是否同時有修飾鍵(Control,Alt, Shift)等信息。這些信息由JavaScript解釋器自動填好后作為一個參數(shù)傳遞給相應事件處理函數(shù),事件處理函數(shù)根據(jù)這

40、些信息執(zhí)行相應動作。 6JavaScript的幾個內(nèi)置函數(shù) JavaScript的內(nèi)置函數(shù)不屬于任何對象,所以在JavaScript語句的任何地方都可以使用這些函數(shù)。JavaScript的內(nèi)置函數(shù)有: (1)eval(字符串) 該函數(shù)的參數(shù)是一個字符串,此函數(shù)將這個字符串作為JavaScript語句或表達式進行分析,要么執(zhí)行它,要么返回結果。如果傳遞給這個函數(shù)的字符串中包含命令,這些命令也可以被執(zhí)行。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript的內(nèi)置對象和函數(shù)的內(nèi)置對象和函數(shù) (2)escape(字符串): 接受一個字符串,這個字符串可

41、以有空格、分號等字符,escape()把這個字符串轉換成Cookie的內(nèi)部表示方式。Cookie是Web服務器保存在用戶硬盤上的一段文本。Cookie允許一個Web站點在用戶的電腦上保存信息并且隨后再取回它。 (3)unescape() 接受一個Cookie,把這個Cookie的內(nèi)部表示方式轉化成普通的字符串形式。 (4)parseInt(): 函數(shù)從一個字符串首提取一個整數(shù)并返回。如果在提取過程中遇到除了數(shù)字、符號、小數(shù)點、指數(shù)符號以外的其他字符,該函數(shù)就停止提取,并返回已提取的結果。如果第一個字符就是不可提取的,那么該函數(shù)返回“NaN”值,表示字符串中不存在數(shù)字。 (5)parseFloa

42、t(): 函數(shù)從一個字符串首提取一個浮點值并返回。如果在提取過程中遇到除了數(shù)字、符號、小數(shù)點、指數(shù)符號以外的其他字符,該函數(shù)就停止提取,并返回已提取的結果。如果第一個字符就不可提取,那么該函數(shù)返回“NaN”值,表示字符串中不存在數(shù)字。 (6)isNaN(): isNaN函數(shù)可以測試上面兩個函數(shù)返回的結果是否為NaN,如果是,則返回true。 (7)isFinite(n):該函數(shù)用來測試參數(shù)n是否是一個無窮值。如果是,則返回false。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript中的瀏覽器對象中的瀏覽器對象 由于JavaScript在網(wǎng)頁

43、中使用,網(wǎng)頁通過瀏覽器瀏覽,在瀏覽器中打開一個頁面時瀏覽器會自動創(chuàng)建一些對象,這些對象存放了HTML頁面的屬性和其他相關信息,這些對象在瀏覽器上運行,所以我們把它們稱為瀏覽器對象。瀏覽器對象主要有navigator、Window、document、location和history對象。對象之間有從屬關系,Window對象是其他部分的祖先,其子對象包括location對象、document對象和history對象。在程序中子對象被認為是父對象的屬性。例如,要引用document對象,應該用格式:Window.document。下面分別介紹這些對象。 1Window對象 Window對象反映的是一

44、個完整的瀏覽器窗口。只要瀏覽器窗口打開,即使瀏覽器中沒有加載任何頁面,JavaScript也會建立這個對象。Window對象提供了處理瀏覽器窗口的方法和屬性。該對象對應于HTML文檔中的和兩種標識。 7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript中的瀏覽器對象中的瀏覽器對象 (1)Window對象的常用屬性: Closed屬性:判斷一個窗口是否關閉。 frames屬性:記錄當前窗口中所有幀的信息,是一個frame對象的數(shù)組。 parent屬性:指明當前窗口或幀的父窗口。 defaultstatus屬性:默認狀態(tài),它的值顯示在窗口的狀態(tài)欄中

45、。 status屬性:狀態(tài)欄中當前顯示的信息。 top屬性:定義的是一系列瀏覽器上層的瀏覽器窗口。 window屬性:指的是當前窗口。 self屬性:引用當前文檔對應的窗口。 history屬性:提供當前窗口的歷史紀錄,可在網(wǎng)頁導航中發(fā)揮作用。 Location屬性:提供當前窗口的URL信息。 Locationbar屬性:代表瀏覽器的地址欄。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript中的瀏覽器對象中的瀏覽器對象 (2)Window對象的常用方法: open()方法:用于創(chuàng)建一個新窗口或在指定的命令窗口內(nèi)打開頁面。打開窗口的基本格式:W

46、indow .open(URL,窗口名字,窗口屬性)。 close()方法:用于關閉一個瀏覽器窗口。 alert(字符串)方法:用于彈出一個警告框,在警告框內(nèi)顯示字符串文本。 confirm(字符串)方法:用于彈出一個確定框,在確定框內(nèi)顯示字符串文本。通常在用戶決定某些行動是否采取時使用。 prompt(字符串,缺省值)方法:用于彈出一個提示框,提示框中顯示字符串,并且在提示框中有一個文本框要求用戶輸入信息。如果用戶修改輸入文本框內(nèi)的文本后單擊“確定”按鈕,則返回用戶輸入的字符串。如果用戶單擊“取消”按鈕,則返回null值。 back()方法:用于指示瀏覽器載入歷史紀錄的上一個URL地址,相當

47、于瀏覽器工具欄中的后退按鈕。 forward()方法:用于指示瀏覽器載入歷史紀錄的下一個URL地址,相當于瀏覽器工具欄中的前進按鈕。 home()方法:用于指示瀏覽器載入預先設定的主頁頁面,相當于瀏覽器工具欄中的返回主頁按鈕。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript中的瀏覽器對象中的瀏覽器對象 2document對象 存儲著當前頁的一些信息,代表的是當前整個頁面,頁面的前景色、背景色、鏈接顏色、表單、圖像等都作為document對象的屬性存在。(1)document對象的屬性 title屬性:指出文檔的標題,相當于HTML文檔中之間

48、的內(nèi)容。 lastModified屬性:指出文檔最后修改的日期。 bgcolor屬性:指出文檔的背景色,相當于HTML中的bgcolor屬性。 fgcolor屬性:指出文檔的前景色,相當于HTML中的text屬性。 alinkColor屬性:指出鼠標單擊時的鏈接顏色。 vlinkColor屬性:指出已訪問過的鏈接顏色。 links屬性:數(shù)組,存放文檔中所有鏈接對象,每個數(shù)組元素是一個鏈接對象。 7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript中的瀏覽器對象中的瀏覽器對象 Images屬性:數(shù)組,存放文檔中所有的圖形對象,每個數(shù)組元素是一個圖

49、形對象。 URL屬性:指出文檔對應的URL地址。 (2)document對象的主要方法 write(字符串):將字符串寫到一個新文檔??梢允亲址A炕蛘呤亲址兞?。 writeln(字符串):將字符串寫到一個新文檔,并在字符串末尾加上換行符。 clear():清除文檔當前內(nèi)容。 Open()和close():打開一個新文檔和關閉當前文檔。最好先用Open()方法打開一個文檔,然后再用write()或者writeln()方法寫入,寫入完成后,再用close()方法關閉。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript中的瀏覽器對象中的瀏覽

50、器對象 3location對象 提供當前頁面的URL信息。它有一組屬性,用于存儲URL的各個組成部分。它的方法可以重裝當前頁面或裝入新頁面。 例如:http:/:80/book/1.html#section1 協(xié)議名稱為http,主機名稱為,端口號為80,頁面地址為book/1.html,在頁面中有一個頁面內(nèi)跳轉錨標,名稱為section1。(1)location對象的屬性 Hash屬性:如果頁面中有頁面內(nèi)跳轉的錨標,則Hash屬性返回HREF中#號后面的字符串。如上例中用location.hash可以獲得錨標為#section1。 Host屬性:提供URL頁面所在的Web服務器主機名稱和端口

51、號。如上例中用location.host可以獲得:80。 Hostname屬性:提供URL的主機名稱部分。如上例中的。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript中的瀏覽器對象中的瀏覽器對象 Href屬性:提供整個URL。如上例中的 http:/:80/book/1.html#section1。 Pathname屬性:提供文檔在主機上的路徑及文件名。如上例中的book/1.html。 Port屬性:返回URL的中的端口號部分。如上例中的80。 Protocol屬性:指定協(xié)議名稱。 Search屬性:提供完整URL中“?”號后面的查詢字符

52、串。在瀏覽網(wǎng)頁時常會發(fā)現(xiàn)搜索站點的頁面URL中問號“?”后還有一些信息,這些信息往往是提交到服務器上進行搜索的信息。 (2)location對象的方法 reload()方法:刷新當前頁面,相當于工具欄上的刷新按鈕。例如定義一個刷新頁面的按鈕,格式為: replace(URL地址)方法:用指定的URL地址代替當前頁面。 Assign(URL地址)方法:將當前頁面導航到指定的URL地址上去。 7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript中的瀏覽器對象中的瀏覽器對象 4history對象 history對象存儲著最近訪問過的URL地址。它有一

53、個length屬性,用于記錄該對象存儲的URL地址的個數(shù)。history對象的方法:(1)back()方法:裝入歷史清單中上一個URL的文檔,相當于瀏覽器的后退按鈕。(2)forward()方法:裝入歷史清單中下一個URL的文檔,對應瀏覽器的前進按鈕。(3)go(n)方法:裝入歷史清單中指定位置的文檔,如果指定的是一個整數(shù),表示向前進,如果是一個負數(shù),表示向后退。go(-1)的功能和back()方法的功能是一樣的。 5navigator對象 保存瀏覽器廠家、版本和功能的信息。navigator的常用屬性如下: appCodeName屬性:提供當前瀏覽器的代碼名。 appName屬性:提供當前瀏

54、覽器的名稱。 appVersion屬性:提供當前瀏覽器的版本號。 userAgent屬性:反映瀏覽器完整的用戶代理標識。 navigator還有一個javaEnabled()方法,用于指出在瀏覽器中是否可以使用Java語言,該方法的返回值是一個布爾值。7.3JavaScriptJavaScript中的對象中的對象JavaScriptJavaScript中的瀏覽器對象中的瀏覽器對象 6document的子對象 document的子對象包括link對象、anchor對象和form對象 。 link對象:包含鏈接信息,可以用links數(shù)組訪問link對象,數(shù)組中的每個元素都是當前頁中的一個link對

55、象。 例如,把當前頁面中第一個鏈接對象的URL地址賦給變量link1,格式為: link1=document.links0.href; anchor對象:代表當前文檔中的一個鏈接點,用數(shù)組links來訪問。 form對象:代表文檔中的表單。用數(shù)組forms來訪問。7.4JavaScriptJavaScript中的事件中的事件 JavaScript是基于對象(object-based)的語言,而基于對象的基本特征就是采用事件驅動(event-driven)。事件定義了用戶與Web頁面交互時產(chǎn)生的各種動作。通常我們把鼠標或熱鍵的動作稱之為事件(Event),例如,單擊一個按鈕就產(chǎn)生一個事件。 在J

56、avaScript中,對象事件的處理通常由函數(shù)來完成,所以事件處理程序的基本格式與函數(shù)全部一樣。格式如下: Function 事件處理名(參數(shù)表) 事件處理語句集; 歸納起來,必須使用的事件有三大類: 1引起頁面之間跳轉的事件,主要是超鏈接事件。 2事件瀏覽器自己引起的事件。 3事件在表單內(nèi)部與界面對象交互引起的事件。 句柄是一個 32 位的正整數(shù),用來存儲特定的事件處理函數(shù),識別窗體或其他對象,如字體或位圖。Windows 給每個窗口一個唯一的句柄,通過句柄操縱該窗口。一個句柄的名字是在對應的事件名字之前加上on,如處理Load事件的句柄通常是onLoad。7.4JavaScriptJava

57、Script中的事件中的事件 瀏覽器事件瀏覽器事件 常用的瀏覽器事件有Load、Unload和Submit。 1Load事件 當瀏覽器裝載網(wǎng)頁時會觸發(fā)Load事件。這個事件處理函數(shù)在其他所有JavaScript程序和網(wǎng)頁之前被執(zhí)行,用來完成網(wǎng)頁中所有數(shù)據(jù)的初始化、彈出提示窗口或密碼確認窗口。通常在標記中使用這個事件的句柄。 2Unload事件 Unload事件與Load事件正好相反,當卸載一個頁面時會發(fā)生Unload事件,即在瀏覽器載入一個新的網(wǎng)頁之前或當用戶退出文檔時觸發(fā) unload 事件。onUnload 用在 BODY 或 FRAMESET 標簽上。如。 3Submit事件 當用戶完成

58、信息輸入提交表單時發(fā)生該事件。通常在標簽中使用onSubmit句柄。當用戶提交表單時,JavaScript調用Submit事件的處理函數(shù),對表單數(shù)據(jù)進行驗證,如果所有數(shù)據(jù)驗證都能通過,時間處理函數(shù)就返回true,將表單提交到服務器。如果返回false,則不進行提交,并給出提示信息,讓用戶重新輸入數(shù)據(jù)。7.4JavaScriptJavaScript中的事件中的事件 鍵盤事件鍵盤事件 常用的鍵盤事件有KeyDown、KeyPress和KeyUp事件。 1KeyDown事件 當用戶按下一個鍵時會發(fā)生該事件。KeyDown事件總是發(fā)生在KeyPress事件之前,如果KeyDown事件的處理函數(shù)返回fa

59、lse ,則KeyPress事件不會發(fā)生。當KeyDown事件發(fā)生時,JavaScript會自動調用onKeyDown句柄。KeyDown事件適用的對象有document、Image(圖像)、Link(超級鏈接)、Textarea(文本區(qū)域)。 2KeyPress事件 當用戶按下一個鍵時觸發(fā)該事件,當KeyDown事件的處理函數(shù)返回的值為true時KeyPress事件接著發(fā)生。當用戶按著一個鍵不松開時,KeyPress事件會不斷發(fā)生。當KeyPress事件發(fā)生時,JavaScript會自動調用onKeyPress句柄。KeyPress事件適用的對象有document、Image、Link、Te

60、xtarea。 3KeyUp事件 當用戶釋放鍵盤上的一個鍵時觸發(fā)KeyUp 事件。當KeyUp事件發(fā)生時,JavaScript會自動調用onKeyUp句柄。KeyUp事件適用的對象有document、Image、Link、Textarea。 7.4JavaScriptJavaScript中的事件中的事件 鼠標事件鼠標事件 常用的鼠標事件有MouseDown、MouseUp、MouseOver、MouseMove、MouseOut、Click、Blur、Change、Move、Select和Focus事件。在鼠標事件發(fā)生時,鼠標事件的信息被作為一個參數(shù)傳送給鼠標事件處理函數(shù)。 1MouseDow

溫馨提示

  • 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

提交評論