JavaScript 深度剖析(從入門到精通)_第1頁
JavaScript 深度剖析(從入門到精通)_第2頁
JavaScript 深度剖析(從入門到精通)_第3頁
JavaScript 深度剖析(從入門到精通)_第4頁
JavaScript 深度剖析(從入門到精通)_第5頁
已閱讀5頁,還剩80頁未讀 繼續(xù)免費閱讀

下載本文檔

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

文檔簡介

1、第一講 JavaScript語言概況 第二講 JavaScript基本數據結構 第三講 JavaScript程序構成 第四講 基于對象的JavaScript語言 第五講 創(chuàng)建新對象 第六講 使用內部對象系統(tǒng) 第七講 窗口及輸入輸出 第八講 WEB頁面信息的交互 第九講 實現更復雜的交互第一講 JavaScript語言概況         Internet時代,造就了我們新的工作和生活方式,其互聯性、開放性和共享信息的模式,打破了傳統(tǒng)信息傳播方式的重重壁壘,為我們帶來了新的機遇。隨著計算機和信息時代的到來,人類社會前進的腳步在

2、逐漸加快,每一天都有新的事情發(fā)生,每一天都在創(chuàng)造著奇跡。隨著Internet技術的突飛猛進,各行各業(yè)都在加入Internet的行業(yè)中來。無論從管理方面,還是從商業(yè)角度來看,Internet都可以帶來無限生機。通過Internet,可以實現地區(qū)、集體乃至個人的連接,從而達到一種“統(tǒng)一的和諧”。那么怎樣把自己的或公司的信息資源加入到 WWW 服務器,是廣大用戶日益關心的問題。采用超鏈技術(超文本和超媒體技術)是實現這個目標最簡單的、最快速的手段和途徑。具體實現這種手段的支持環(huán)境,那就是HTML超文本標識語言。通過它們可制作所需的Web網頁。 通過超文本(Hyper Text)和超媒體(Hyper

3、Media)技術結合超鏈接(Hyper link)的鏈接功能將各種信息組織成網絡結構(web),構成網絡文檔(Document),實現Internet上的“漫游”。通過HTML符號的描述就可以實現文字、表格、聲音、圖像、動畫等多媒體信息的檢索。然而采用這種超鏈技術存在有一定的缺陷,那就是它只能提供一種靜態(tài)的信息資源,缺少動態(tài)的客戶端與服務器端的交互。雖然可通過CGI (Common Gateway Interface)通用網關接口實現一定的交互,但由于該方法編程較為復雜,因而在一段時間防礙了Internet技術的發(fā)展。而JavaScript的出現,無凝為Internet網上用戶帶來了一線生機。

4、可以這樣說,JavaScript的出現是時代的需求,是當今的信息時代造就了JavaScript。JavaScript的出現,它可以使得信息和用戶之間不僅只是一種顯示和瀏覽的關系,而是實現了一種實時的、動態(tài)的、可交式的表達能力。從而基于CGI靜態(tài)的HTML頁面將被可提供動態(tài)實時信息,并對客戶操作進行反應的Web頁面的取代。JavaScript腳本正是滿足這種需求而產生的語言。它深受廣泛用戶的喜愛的歡迎。它是眾多腳本語言中較為優(yōu)秀的一種,它與WWW的結合有效地實現了網絡計算和網絡計算機的藍圖。無凝Java家族將占領Internet網絡的主導地位。因此,盡快掌握JavaScript腳本語言編程方法是

5、我國廣大用戶日益關心的。一、什么是JavaScriptJavaScript是一種基于對象(Object)和事件驅動(Event Driven)并具有安全性能的腳本語言。使用它的目的是與HTML超文本標記語言、Java 腳本語言(Java小程序)一起實現在一個Web頁面中鏈接多個對象,與Web客戶交互作用。從而可以開發(fā)客戶端的應用程序等。它是通過嵌入或調入在標準的HTML語言中實現的。它的出現彌補了HTML語言的缺陷,它是Java與HTML折衷的選擇,具有以下幾個基本特點:是一種腳本編寫語言JavaScript是一種腳本語言,它采用小程序段的方式實現編程。像其它腳本語言一樣,JavaScript

6、同樣已是一種解釋性語言,它提供了一個易的開發(fā)過程。 它的基本結構形式與C、C+、VB、Delphi十分類似。但它不像這些語言一樣,需要先編譯,而是在程序運行過程中被逐行地解釋。它與HTML標識結合在一起,從而方便用戶的使用操作。 基于對象的語言。JavaScript是一種基于對象的語言,同時以可以看作一種面向對象的。這意味著它能運用自己已經創(chuàng)建的對象。因此,許多功能可以來自于腳本環(huán)境中對象的方法與腳本的相互作用。 簡單性JavaScript的簡單性主要體現在:首先它是一種基于Java基本語句和控制流之上的簡單而緊湊的設計, 從而對于學習Java是一種非常好的過渡。其次它的變量類型是采用弱類型,

7、并未使用嚴格的數據類型。 安全性JavaScript是一種安全性語言,它不允許訪問本地的硬盤,并不能將數據存入到服務器上,不允許對網絡文檔進行修改和刪除,只能通過瀏覽器實現信息瀏覽或動態(tài)交互。從而有效地防止數據的丟失。 動態(tài)性的JavaScript是動態(tài)的,它可以直接對用戶或客戶輸入做出響應,無須經過Web服務程序。它對用戶的反映響應,是采用以事件驅動的方式進行的。所謂事件驅動,就是指在主頁(Home Page)中執(zhí)行了某種操作所產生的動作,就稱為“事件”(Event)。比如按下鼠標、移動窗口、選擇菜單等都可以視為事件。當事件發(fā)生后,可能會引起相應的事件響應。 跨平臺性JavaScript是依

8、賴于瀏覽器本身,與操作環(huán)境無關,只要能運行瀏覽器的計算機,并支持JavaScript的瀏覽器就可正確執(zhí)行。從而實現了“編寫一次,走遍天下”的夢想。 實際上JavaScript最杰出之處在于可以用很小的程序做大量的事。無須有高性能的電腦,軟件僅需一個字處理軟件及一瀏覽器,無須WEB服務器通道,通過自己的電腦即可完成所有的事情。綜合所述JavaScript 是一種新的描述語言,它可以被箝入到 HTML 的文件之中。 JavaScript語言可以做到回應使用者的需求事件 (如: form 的輸入) ,而不用任何的網路來回傳輸資料,所以當一位使用者輸入一項資料時,它不用經過傳給伺服端 (server)

9、處理,再傳回來的過程,而直接可以被客戶端 (client) 的應用程式所處理。JavaScript 和 Java 很類似,但到底并不一樣! Java 是一種比 JavaScript 更復雜許多的程式語言,而 JavaScript 則是相當容易了解的語言。JavaScript 創(chuàng)作者可以不那麼注重程式技巧,所以許多 Java 的特性在 Java Script 中并不支援。 二、JavaScript和Java的區(qū)別雖然JavaScript與Java有緊密的聯系,但卻是兩個公司開發(fā)的不同的兩個產品。Java是SUN公司推出的新一代面向對象的程序設計語言,特別適合于Internet應用程序開發(fā);而Ja

10、vaScript是Netscape公司的產品,其目的是為了擴展Netscape Navigator功能,而開發(fā)的一種可以嵌入Web頁面中的基于對象和事件驅動的解釋性語言, 它的前身是Live Script;而Java的前身是Oak語言。下面對兩種語言間的異同作如下比較:基于對象和面向對象Java是一種真正的面向對象的語言,即使是開發(fā)簡單的程序,必須設計對象。 JavaScript是種腳本語言,它可以用來制作與網絡無關的,與用戶交互作用的復雜軟件。它是一種基于對象(Object Based)和事件驅動(Event Driver)的編程語言。因而它本身提供了非常豐富的內部對象供設計人員使用。 解釋

11、和編譯兩種語言在其瀏覽器中所執(zhí)行的方式不一樣。Java的源代碼在傳遞到客戶端執(zhí)行之前,必須經過編譯,因而客戶端上必須具有相應平臺上的仿真器或解釋器,它可以通過編譯器或解釋器實現獨立于某個特定的平臺編譯代碼的束縛。JavaScript是一種解釋性編程語言,其源代碼在發(fā)往客戶端執(zhí)行之前不需經過編譯,而是將文本格式的字符代碼發(fā)送給客戶編由瀏覽器解釋執(zhí)行。 強變量和弱變量兩種語言所采取的變量是不一樣的。Java采用強類型變量檢查,即所有變量在編譯之前必須作聲明。如: Integer x; String y;x=1234;x=4321;其中X=1234說明是一個整數,Y=4321說明是一個字符串。Jav

12、aScript中變量聲明,采用其弱類型。即變量在使用前不需作聲明,而是解釋器在運行時檢查其數據類型,如:x=1234;y"4321"前者說明x為其數值型變量,而后者說明y為字符型變量。代碼格式不一樣Java是一種與HTML無關的格式,必須通過像HTML中引用外媒體那么進行裝載,其代碼以字節(jié)代碼的形式保存在獨立的文檔中。JavaScript的代碼是一種文本字符格式,可以直接嵌入HTML文檔中,并且可動態(tài)裝載。編寫HTML文檔就像編輯文本文件一樣方便。 嵌入方式不一樣在HTML文檔中,兩種編程語言的標識不同,JavaScript使用<Script>.</Scr

13、ipt>來標識,而Java使用<applet>.</applet>來標識。 靜態(tài)聯編和動態(tài)聯編Java采用靜態(tài)聯編,即Java的對象引用必須在編譯時的進行,以使編譯器能夠實現強類型檢查。JavaScript采用動態(tài)聯編,即JavaScript的對象引用在運行時進行檢查,如不經編譯則就無法實現對象引用的檢查。 三、JavaScript程序運行環(huán)境1.Java運行環(huán)境軟件環(huán)境:Windows 95/98或Windows NT。 Netscape Navigator x.0或Internet Explorer x.0。 用于編輯HTML文檔的字符編輯器(WS、WPS、N

14、otepad、WordPad等)或HTML文檔編輯器。硬件配置:首先必須具備運行Windows 95/98或Windows NT的基本硬件配置環(huán)境。推薦:基本內存32M。 CRT只少需要256顏色,分辨率在640X480以上。 CPU只少233以上。 鼠標和其它外部設置(根據需要選用)。 四、編寫第一個JavaScript程序下面我們通過一個例子,編寫第一個JavaScript程序。通過它可說明JavaScript的腳本是怎樣被嵌入到HTML文檔中的。test1.html文檔:<html><head><Script Language ="JavaScri

15、pt">/ JavaScript Appears here.alert("這是第一個JavaScript例子!");alert("歡迎你進入JavaScript世界!"); alert("今后我們將共同學習JavaScript知識!");</Script> </Head></Html>在Internet Explore5.0中運行行后的結果見圖所示。圖 程序運行的結果說明:test.html是HTML文檔,其標識格式為標準的HTML格式; 如同HTML標識語言一樣, JavaScri

16、pt程序代碼是一些可用字處理軟件瀏覽的文本,它在描述頁面的HTML相關區(qū)域出現。 JavaScript代碼由 <Script Language ="JavaScript">.</Script>說明。在標識<Script Language ="JavaScript">.</Script>之間就可加入JavaScript腳本 alert()是JavaScript的窗口對象方法,其功能是彈出一個具有OK對話框并顯示()中的字符串 通過<!- ./->標識說明:若不認識JavaScript代碼的瀏覽器,

17、則所有在其中的標識均被忽略;若認識,則執(zhí)行其結果。使用注釋這是一個好的編程習慣,它使其他人可以讀懂你的語言。 JavaScript 以 </Script> 標簽結束。 從上面的實例分析中我們可以看出,編寫一個JavaScript程序確實非常容易的。第二講 JavaScript基本數據結構        JavaScript提供腳本語言的編程與C+非常相似,它只是去掉了語言中有關指針等容易產生的錯誤,并提供了功能強大的類庫。對于已經具備+或語言的人來說,學習JavaScript腳本語言是一件非常輕松愉快的事。 一、

18、JavaScript代碼的加入JavaScript的腳本包括在HTML中,它成為HTML文檔的一部分。與HTML標識相結合,構成了一個功能強大的Internet網上編程語言。可以直接將JavaScript腳本加入文檔:<Script Language ="JavaScript">JavaScript語言代碼;JavaScript 語言代碼; .</Script>說明: 通過標識<Script>.</Script>指明JavaScript腳本源代碼將放入其間。 通過屬性Language ="JavaScript&quo

19、t;說明標識中是使用的何種語言,這里是JavaScript語言, 表示在JavaScript中使用的語言。下面是將JavaScript腳本加入Web文檔中的例子:Test2.html<HTML><Head><Script Language ="JavaScript">document. Write("這是電腦報網絡學校");document. close();</Script></Head></HTML> 在瀏覽器的窗口中調用test2.html,則顯示“這是電腦報網絡學校”字串。見

20、圖2所示。圖2 說明:Document. write()是文檔對象的輸出函數,其功能是將括號中的字符或變量值輸出到窗口;document. close()是將輸出關閉。可將<Script>.</Script>標識放入head>. </Head>或<Body> .</Body>之間。將JavaScript標識放置<Head>. </Head>在頭部之間,使之在主頁和其余部分代碼之前裝載,從而可使代碼的功能更強大;可以將JavaScript標識放置在<Body>. </Body>主體之

21、間以實現某些部分動態(tài)地創(chuàng)建文檔。二、基本數據類型 JavaScript腳本語言同其它語言一樣,有它自身的基本數據類型、表達式和算術運算符以及程序的基本框架結構。JavaScript提供了四種基本的數據類型用來處理數字和文字, 而變量提供存放信息的地方, 表達式則可以完成較復雜的信息處理。1、基本數據類型在JavaScript中四種基本的數據類型:數值(整數和實數)、字符串型(用“”號或括起來的字符或數值)、布爾型(使True或False表示)和空值。在JavaScript的基本類型中的數據可以是常量,也可以變量。由于JavaScript采用弱類型的形式,因而一個數據的變量或常量不必首先作聲明,

22、而是在使用或賦值時確定其數據的類型的。當然也可以先聲明該數據的類型,它是通過在賦值時自動說明其數據類型的。2、常量整型常量JavaScript的常量通常又稱字面常量,它是不能改變的數據。其整型常量可以使用十六進制、八進制和十進制表示其值。實型常量實型常量是由整數部分加小數部分表示,如12.32、193.98 。可以使用科學或標準方法表示:5E7、4e5等。布爾值布爾常量只有兩種狀態(tài):True或False。 它主要用來說明或代表一種狀態(tài)或標志,以說明操作流程。它與是不一樣的,可以用或表示其狀態(tài),而JavaScript只能用True或False表示其狀態(tài)。字符型常量使用單引號()或雙引號(“)括起

23、來的一個或幾個字符。如 "This is a book of JavaScript "、"3245"、"ewrt234234" 等。空值JavaScript中有一個空值null,表示什么也沒有。如試圖引用沒有定義的變量,則返回一個Null值。特殊字符同語言一樣,JavaScript中同樣以有些以反斜杠()開頭的不可顯示的特殊字符。通常稱為控制字符。3、變量變量的主要作用是存取數據、提供存放信息的容器。對于變量必須明確變量的命名、變量的類型、變量的聲明及其變量的作用域。變量的命名JavaScript中的變量命名同其計算機語言非常相似,這

24、里要注意以下兩點:、必須是一個有效的變量,即變量以字母開頭,中間可以出現數字如test1、text2等。除下劃線()作為連字符外,變量名稱不能有空格、()、()、(,)或其它符號。、不能使用JavaScript中的關鍵字作為變量。在JavaScript中定義了多個類鍵字,這些關鍵是JavaScript內部使用的,不能作為變量的名稱。如Var、int、double、true不能作為變量的名稱。在對變量命名時,最好把變量的意義與其代表的意思對應起來,以免出現錯誤。變量的類型在JavaScript中,變量可以用命令Var作聲明:var mytest;該例子定義了一個mytest變量。但沒有賦予它的值

25、。Var mytest=”This is a book”該例子定義了一個mytest變量, 同時賦予了它的值。在JavaScript中,變量以可以不作聲明,而在使用時再根據數據的類型來確其變量的類型。如:x=100 y="125" xy= True cost=19.5等。其中x整數,y為字符串,xy為布爾型,cost為實型。變量的聲明及其作用域JavaScript變量可以在使用前先作聲明,并可賦值。通過使用var關鍵字對變量作聲明。對變量作聲明的最大好處就是能及時發(fā)現代碼中的錯誤;因為JavaScript是采用動態(tài)編譯的,而動態(tài)編譯是不易發(fā)現代碼中的錯誤,特別是變量命名的方

26、面。對于變量還有一個重要性那就是變量的作用域。在JavaScript中同樣有全局變量和局部變量。全局變量是定義在所有函數體之外,其作用范圍是整個函數;而局部變量是定義在函數體之內,只對其該函數是可見的,而對其它函數則是不可見的。三、表達式和運算符、表達式在定義完變量后,就可以對它們進行賦值、改變、計算等一系列操作,這一過程通常又叫稱一個叫表達式來完成,可以說它是變量、常量、布爾及運算符的集合,因此表達式可以分為算術表述式、字串表達式、賦值表達式以及布爾表達式等。、運算符運算符完成操作的一系列符號,在JavaScript中有算術運算符,如、-、*、/等;有比較運算符如!、等; 有邏輯布爾運算符如

27、!(取反)、|、|; 有字串運算如 、 等。在JavaScript主要有雙目運算符和單目運算符。其雙目運算符由下列組成:操作數運算符 操作數即由兩個操作數和一個運算符組成。如5040、"This"+"that"等。單目運算符,只需一個操作數,其運算符可在前或后。()算術運算符JavaScript中的算術運算符有單目運算符和雙目運算符。雙目運算符:+(加) 、-(減)、 *(乘)、 /(除)、 %(取模) 、|(按位或)、&(按位與)、<<(左移)、 >>(右移)、 >>>(右移,零填充)。單目運算符:-(

28、取反)、(取補)、+(遞加1)、-(遞減1)。()比較運算符比較運算符它的基本操作過程是,首先對它的操作數進行比較,爾后再返回一個true或False值,有個比較運算符:<(小于)、>(大于)、<=(小于等于)、>=(大于等于)、=(等于)、!=(不等于)。()布爾邏輯運算符在JavaScript中增加了幾個布爾邏輯運算符:!(取反)、&=(與之后賦值)、 &(邏輯與)、 |=(或之后賦值)、 |(邏輯或)、 =(異或之后賦值)、 (邏輯異或)、 ?:(三目操作符)、|(或)、=(等于)、|=(不等于)。其中三目操作符主要格式如下:操作數?結果:結果若操

29、作數的結果為真,則表述式的結果為結果,否則為結果。四、范例下面是一個跑馬燈效果的JavaScript文檔。Test2_1.html<html><head><script Language="JavaScript">var msg="這是一個跑馬燈效果的JavaScript文檔"var interval = 100;var spacelen = 120;var space10=" "var seq=0;function Scroll() len = msg.length;window.status =

30、 msg.substring(0, seq+1);seq+;if ( seq >= len ) seq = spacelen; window.setTimeout("Scroll2();", interval );elsewindow.setTimeout("Scroll();", interval ); function Scroll2() var out=""for (i=1; i<=spacelen/space10.length; i+) out += space10;out = out + msg;len=out.

31、length;window.status=out.substring(seq, len);seq+;if ( seq >= len ) seq = 0; ;window.setTimeout("Scroll2();", interval ); Scroll();</script><body></body></html>本講介紹了JavaScript腳本是如何加入Web頁面, 并學習了JavaScript語言中的基本數據類型、變量、常量、操作運算符等。從本講中的內容中可以看出,對于已經掌握語言的人來說,學習JavaScri

32、pt真是一件非常輕松愉快的事。JavaScript技術講座第三講 JavaScript程序構成 JavaScript腳本語言的基本構成是由控制語句、函數、對象、方法、屬性等,來實現編程的。 一、程序控制流在任何一種語言中,程序控制流是必須的,它能使得整個程序減小混亂,使之順利按其一定的方式執(zhí)行。下面是JavaScript常用的程序控制流結構及語句: 、if條件語句基本格式if(表述式)語句段;.else語句段;.功能:若表達式為true,則執(zhí)行語句段;否則執(zhí)行語句段。說明:if -else 語句是JavaScript中最基本的控制語句,通過它可以改變語句的執(zhí)行順序。 表達式中必須使用關系語句,

33、來實現判斷,它是作為一個布爾值來估算的。 它將零和非零的數分別轉化成false和true。 若if后的語句有多行,則必須使用花括號將其括起來。 if語句的嵌套if(布爾值)語句;else(布爾值)語句;else if(布爾值)語句;else 語句;在這種情況下,每一級的布爾表述式都會被計算,若為真,則執(zhí)行其相應的語句,否則執(zhí)行else后的語句。、For循環(huán)語句基本格式for(初始化;條件;增量)語句集;功能:實現條件循環(huán),當條件成立時,執(zhí)行語句集,否則跳出循環(huán)體。說明:初始化參數告訴循環(huán)的開始位置,必須賦予變量的初值; 條件:是用于判別循環(huán)停止時的條件。若條件滿足,則執(zhí)行循環(huán)體,否則 跳出。

34、增量:主要定義循環(huán)控制變量在每次循環(huán)時按什么方式變化。 三個主要語句之間,必須使用逗號分隔。 、while循環(huán)基本格式while(條件)語句集;該語句與For語句一樣,當條件為真時,重復循環(huán),否則退出循環(huán)。 For與while語句兩種語句都是循環(huán)語句,使用For語句在處理有關數字時更易看懂,也較緊湊;而while循環(huán)對復雜的語句效果更特別。、break和continue語句與C+語言相同,使用break語句使得循環(huán)從For或while中跳出,continue使得跳過循環(huán)內剩余的語句而進入下一次循環(huán)。二、函數函數為程序設計人員提供了一個豐常方便的能力。通常在進行一個復雜的程序設計時,總是根據所要

35、完成的功能,將程序劃分為一些相對獨立的部分,每部分編寫一個函數。從而,使各部分充分獨立,任務單一,程序清晰,易懂、易讀、易維護。JavaScript函數可以封裝那些在程序中可能要多次用到的模塊。并可作為事件驅動的結果而調用的程序。從而實現一個函數把它與事件驅動相關聯。這是與其它語言不樣的地方。、JavaScript函數定義Function 函數名 (參數,變元)函數體;.Return 表達式;說明:當調用函數時,所用變量或字面量均可作為變元傳遞。函數由關鍵字Function定義。函數名:定義自己函數的名字。參數表,是傳遞給函數使用或操作的值,其值可以是常量 ,變量或其它表達式。通過指定函數名(

36、實參)來調用一個函數。必須使用Return將值返回。函數名對大小寫是敏感的。、函數中的形式參數:在函數的定義中,我們看到函數名后有參數表,這些參數變量可能是一個或幾個。那么怎樣才能確定參數變量的個數呢?在JavaScript中可通過arguments .Length來檢查參數的個數。例:Function function_Name(exp1,exp2,exp3,exp4)Number =function _Name . arguments .length;if (Number>1)document.wrile(exp2);if (Number>2)document.write(ex

37、p3);if(Number>3)document.write(exp4);.三、事件驅動及事件處理、基本概念JavaScript是基于對象(object-based)的語言。這與Java不同,Java是面向對象的語言。而基于對象的基本特征,就是采用事件驅動(event-driven)。它是在用形界面的環(huán)境下,使得一切輸入變化簡單化。通常鼠標或熱鍵的動作我們稱之為事件(Event),而由鼠標或熱鍵引發(fā)的一連串程序的動作,稱之為事件驅動(Event Driver)。而對事件進行處理程序或函數,我們稱之為事件處理程序(Event Handler)。、事件處理程序在JavaScript中對象事件

38、的處理通常由函數(Function)擔任。其基本格式與函數全部一樣,可以將前面所介紹的所有函數作為事件處理程序。格式如下:Function 事件處理名(參數表)事件處理語句集;、事件驅動JavaScript事件驅動中的事件是通過鼠標或熱鍵的動作引發(fā)的。它主要有以下幾個事件:()單擊事件onClick當用戶單擊鼠標按鈕時,產生onClick事件。同時onClick指定的事件處理程序或代碼將被調用執(zhí)行。通常在下列基本對象中產生:button(按鈕對象) checkbox(復選框)或(檢查列表框) radio (單選鈕) reset buttons(重要按鈕) submit buttons(提交按鈕

39、) 例:可通過下列按鈕激活change()文件:<Form><Input type="button" Value=“ ” onClick="change()"></Form>在onClick等號后,可以使用自己編寫的函數作為事件處理程序,也可以使用JavaScript中內部的函數。還可以直接使用JavaScript的代碼等。例: <Input type="button" value=" " onclick=alert("這是一個例子");()onChan

40、ge改變事件當利用text或texturea元素輸入字符值改變時發(fā)該事件,同時當在select表格項中一個選項狀態(tài)改變后也會引發(fā)該事件。例: <Form><Input type="text" name="Test" value="Test" onCharge="check('this.test)"></Form>()選中事件onSelect當Text或Textarea對象中的文字被加亮后,引發(fā)該事件。()獲得焦點事件onFocus當用戶單擊Text或textarea以及s

41、elect對象時,產生該事件。此時該對象成為前臺對象。()失去焦點onBlur當text對象或textarea對象以及select對象不再擁有焦點、而退到后臺時,引發(fā)該文件,他與onFocas事件是一個對應的關系。()載入文件onLoad當文檔載入時,產生該事件。onLoad一個作用就是在首次載入一個文檔時檢測cookie的值,并用一個變量為其賦值,使它可以被源代碼使用。()卸載文件onUnload當Web頁面退出時引發(fā)onUnload事件,并可更新Cookie的狀態(tài)。四、范例 范例1:下例程序是一個自動裝載和自動卸載的例子。即當裝入HTML文檔時調用loadform()函數,而退出該文檔進入

42、另一HTML文檔時則首先調用unloadform()函數,確認后方可進入。 test3_1.htm <HTML><HEAD><script Language="JavaScript"><!-function loadform()alert("這是一個自動裝載例子!");function unloadform()alert("這是一個卸載例子!");/-></Script></HEAD><BODY OnLoad="loadform()" O

43、nUnload="unloadform()"> <a href="test.htm">調用</a></BODY></HTML>見圖1所示:圖1范例2:這是一個獲取瀏覽器版本號的程序。該程序首先顯示一個波浪一提示信息。之后顯示瀏覽器的版本號有關信息。test3_2.htm<html><head><script language="JavaScript"><!-/ ->function makeArray(n)this.length=nr

44、eturn thisfunction hexfromdec(num) hex=new makeArray(1);var hexstring=""var shifthex=16;var temp1=num;for(x=1; x>=0; x-) hexx=Math.round(temp1/shifthex - .5);hexx-1=temp1 - hexx * shifthex;temp1=hexx-1;shifthex /= 16;for (x=1; x>=0; x-) hexstring+=getletter(hexx); return (hexstring);

45、function getletter(num) if (num < 10) return num; else if (num = 10) return "A" if (num = 11) return "B" if (num = 12) return "C" if (num = 13) return "D" if (num = 14) return "E" if (num = 15) return "F" function rainbow(text)var color_

46、d1;var allstring=""for(i=0;i<text.length;i=i+2)color_d1=255*Math.sin(i/(text.length/3);color_h1=hexfromdec(color_d1);allstring+="<FONT COLOR="+color_h1+"ff"+color_h1+">"+text.substring(i,i+2)+"</FONT>"return allstring;function sizefont

47、(text)var color_d1;var allstring=""var flag=0;for(i=0,j=0;i<text.length;i=i+1)if (flag=0) j+;if (j>=7) flag=1;if (flag=1) j=j-1;if (j<=0) flag=0; allstring+="<FONT SIZE="+ j + ">" + text.substring(i,i+1) + "</FONT>"return allstring;documen

48、t.write("<font size=8><CENTER>")document.write("<BR><BR>")document.write( sizefont("這是一個獲取WEB瀏覽器的程序")document.write("</CENTER></font>")document.write("瀏覽器名稱: "+navigator.appName+"<br>");document.wri

49、te("版本號: "+navigator.appVersion+"<br>");document.write("代碼名字: "+navigator.appCodeName+"<br>");document.write("用戶代理標識: "+navigator.userAgent);</script><body></body></html>輸出結果圖2所示。圖2本講介紹了JavaScript程序設計的有關內容。程序流、函數、事

50、件是我們學習掌握JavaScript編程的重點。JavaScript技術講座第四講 基于對象的JavaScript語言         JavaScript語言是基于對象的(Object-Based),而不是面向對象的(object-oriented)。之所以說它是一門基于對象的語言,主要是因為它沒有提供象抽象、繼承、重載等有關面向對象語言的許多功能。而是把其它語言所創(chuàng)建的復雜對象統(tǒng)一起來,從而形成一個非常強大的對象系統(tǒng)。 雖然JavaScript語言是一門基于對象的,但它還是具有一些面向對象的基本特征。它可以根據

51、需要創(chuàng)建自己 的對象,從而進一步擴大JavaScript的應用范圍,增強編寫功能強大的Web文文件。 一、對象的基礎知識 、對象的基本結構 JavaScript中的對象是由屬性(properties)和方法(methods)兩個基本的元素的構成的。前者是對象在實施其所需要行為的過程中,實現信息的裝載單位,從而與變量相關聯;后者是指對象能夠按照設計者的意圖而被執(zhí)行,從而與特定的函數相聯。 、引用對象的途徑 一個對象要真正地被使用,可采用以下幾種方式獲得: 引用JavaScript內部對象; 由瀏覽器環(huán)境中提供; 創(chuàng)建新對象。 這就是說一個對象在被引用之前,這個對象必須存在,否則引用將毫無意義,而

52、出現錯誤信息。從上面中我們可以看出JavaScript引用對象可通過三種方式獲取。要么創(chuàng)建新的對象,要么利用現存的對象。 、有關對象操作語句 JavaScript不是一純面向對象的語言,它設有提供面向對象語言的許多功能,因此JavaScript設計者之所以把它你“基于對象”而不是面向對象的語言,在JavaScript中提供了幾個用于操作對象的語句和關鍵詞及運算符。 1)、For.in語句 格式如下: For(對象屬性名 in 已知對象名) 說明: 該語句的功能是用于對已知對象的所有屬性進行操作的控制循環(huán)。它是將一個已知對象的所有屬性反復置給一個變量;而不是使用計數器來實現的。 該語句的優(yōu)點就是

53、無需知道對象中屬性的個數即可進行操作。 例:下列函數是顯示數組中的內容: Function showData(object) for (var X=0; X<30;X+) document.write(objecti); 該函數是通過數組下標順序值,來訪問每個對象的屬性,使用這種方式首先必須知道數組的下標值,否則若超出范圍,則就會發(fā)生錯誤。而使For.in語句,則根本不需要知道對象屬性的個數,見下: Function showData(object) for(var prop in object) document.write(objectprop); 使用該函數時,在循環(huán)體中,For自

54、動將的屬性取出來,直到最后為此。 2)、with語句 使用該語句的意思是:在該語句體內,任何對變量的引用被認為是這個對象的屬性,以節(jié)省一些代碼。 with object . 所有在with語句后的花括號中的語句,都是在后面object對象的作用域的。 3)、his關鍵詞 this是對當前的引用,在JavaScript由于對象的引用是多層次,多方位的,往往一個對象的引用又需要對另一個對象的引用,而另一個對象有可能又要引用另一個對象,這樣有可能造成混亂,最后自己已不知道現在引用的那一個對象,為此JavaScript提供了一個用于將對象指定當前對象的語句this。 4)、ew運算符 雖然在JavaS

55、cript中對象的功能已經是非常強大的了。但更強大的是設計人員可以按照需求來創(chuàng)建自己的對象,以滿足某一特定的要求。使用New運算符可以創(chuàng)建一個新的對象。其創(chuàng)建對象使用如下格式: Newobject=NEW Object(Parameters table); 其中Newobject創(chuàng)建的新對象:object是已經存在的對象; parameters table參數表;new是JavaScript中的命令語句。 如創(chuàng)建一個日期新對象 newData=New Data() birthday=New Data (December 12.1998) 之后就可使NewData、birthday作為一個新的日

56、期對象了。 、對象屬性的引用 對象屬性的引用可由下列三種方式之一實現: ()使用點(.)運算符 university.Name=“云南省” university.city=“昆明市” university.Date="1999" 其中university是一個已經存在的對象,Name、City、Date是它的三個屬性,并通過操作對其賦值。 ()通過對象的下標實現引用 university0=“云南” university1=“昆明市” university2="1999" 通過數組形式的訪問屬性,可以使用循環(huán)操作獲取其值。 function showun

57、ievsity(object) for (var j=0;j<2; j+) document.write(objectj) 若采用For.in則可以不知其屬性的個數后就可以實現: Function showmy(object) for (var prop in this) docament.write(thisprop); ()通過字符串的形式實現 university"Name"=“云南” university"City"=“昆明市” university"Date"="1999" 、對象的方法的引用 在J

58、avaScript中對象方法的引用是非常簡單的。 ObjectName.methods() 實際上methods()=FunctionName方法實質上是一個函數。 如引用university對象中的showmy()方法,則可使用: document.write (university.showmy() 或:document.write(university) 如引用math內部對象中cos()的方法 則: with(math) document.write(cos(35); document.write(cos(80); 若不使用with則引用時相對要復雜些: document.write(

59、Math.cos(35) document.write(math.sin(80) 二、常用對象的屬性和方法 JavaScript為我們提供了一些非常有用的常用內部對象和方法。用戶不需要用腳本來實現這些功能。這正是基于對象編程的真正目的。 在JavaScript提供了string(字符串)、math(數值計算)和Date(日期)三種對象和其它一些相關的方法。從而為編程人員快速開發(fā)強大的腳本程序提供了非常有利的條件。 1、常用內部對象 在JavaScript中對于對象屬性與方法的引用,有兩種情況:其一是說該對象是靜態(tài)對象,即在引用該對象的屬性或方法時不需要為它創(chuàng)建實例;而另一種對象則在引用它的對象或方法是必須為它創(chuàng)建一個實例,即該對象是動態(tài)對象。 對JavaScript內部對象的引用,以是緊緊圍繞著它的屬性與方法進行的。因而明確對象的靜動性對于掌握和理解JavaScript內部對象

溫馨提示

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

評論

0/150

提交評論