JavaScript_入門教程_第1頁
JavaScript_入門教程_第2頁
已閱讀5頁,還剩20頁未讀 繼續免費閱讀

下載本文檔

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

文檔簡介

1、javascript_入門教程 javascript_入門教程,javascript_入門教程, 第一講 javascript語言概況 其次講 javascript基本數據結構 第三講 javascript程序構成 第四講 基于對象的javascript語言 第五講 創建新對象 第六講 使用內部對象系統 第七講 窗口及輸入輸出 第八講 web頁面信息的交互 第九講 實現更簡單的交互 第一講 javascript語言概況 internet時代,造就了我們新的工作和生活方式,其互聯性、開放性和共享信息的模式,打破了傳統信息傳播方式的重重壁壘,為我們帶來了新的機遇。隨著計算機和信息時代的到來,人類社

2、會前進的腳步在漸漸加快,每一天都有新的事情發生,每一天都在制造著奇跡。隨著internet技術的突飛猛進,各行各業都在加入internet的行業中來。無論從管理方面,還是從商業角度來看,internet都可以帶來無限生氣。通過internet,可以實現地區、集體乃至個人的連接,從而達到一種“統一的和諧”。那么怎樣把自己的或公司的信息資源加入到 服務器,是廣闊用戶日益關懷的問題。采納超鏈技術(超文本和超媒體技術)是實現這個目標最簡潔的、最快速的手段和途徑。詳細實現這種手段的支持環境,那就是html超文本標識語言。通過它們可制作所需的web網頁。 通過超文本(hyper text)和超媒體(hyp

3、er media)技術結合超鏈接(hyper link)的鏈接功能將各種信息組織成網絡結構(web),構成網絡文檔(document),實現internet上的“漫游”。通過html符號的描述就可以實現文字、表格、聲音、圖像、動畫等多媒體信息的檢索。 然而采納這種超鏈技術存在有肯定的缺陷,那就是它只能供應一種靜態的信息資源,缺少動態的客戶端與服務器端的交互。雖然可通過cgi (common gateway interface)通用網關接口實現肯定的交互,但由于該方法編程較為簡單,因而在一段時間防礙了internet技術的進展。而javascript的消失,無凝為internet網上用戶帶來了一

4、線生氣。可以這樣說,javascript的消失是時代的需求,是當今的信息時代造就了javascript。 javascript的消失,它可以使得信息和用戶之間不僅只是一種顯示和掃瞄的關系,而是實現了一種實時的、動態的、可交式的表達力量。從而基于cgi靜態的html頁面將被可供應動態實時信息,并對客戶操作進行反應的web頁面的取代。javascript腳本正是滿意這種需求而產生的語言。它深受廣泛用戶的寵愛的 javascript_入門教程,javascript_入門教程, 歡迎。它是眾多腳本語言中較為優秀的一種,它與的結合有效地實現了網絡計算和網絡計算機的藍圖。無凝java家族將占據intern

5、et網絡的主導地位。因此,盡快把握javascript腳本語言編程方法是我國廣闊用戶日益關懷的。 一、什么是javascript javascript是一種基于對象(object)和大事驅動(event driven)并具有平安性能的腳本語言。使用它的目的是與html超文本標記語言、java 腳本語言(java小程序)一起實現在一個web頁面中鏈接多個對象,與web客戶交互作用。從而可以開發客戶端的應用程序等。它是通過嵌入或調入在標準的html語言中實現的。它的消失彌補了html語言的缺陷,它是java與html折衷的選擇,具有以下幾個基本特點: 是一種腳本編寫語言 javascript是一種

6、腳本語言,它采納小程序段的方式實現編程。像其它腳本語言一樣,javascript同樣已是一種解釋性語言,它供應了一個易的開發過程。 它的基本結構形式與c、c+、vb、delphi非常類似。但它不像這些語言一樣,需要先編譯,而是在程序運行過程中被逐行地解釋。它與html標識結合在一起,從而便利用戶的使用操作。 基于對象的語言。 javascript是一種基于對象的語言,同時以可以看作一種面對對象的。這意味著它能運用自己已經創建的對象。因此,很多功能可以來自于腳本環境中對象的方法與腳本的相互作用。 簡潔性 javascript的簡潔性主要體現在:首先它是一種基于java基本語句和掌握流之上的簡潔而

7、緊湊的設計, 從而對于學習java是一種特別好的過渡。其次它的變量類型是采納弱類型,并未使用嚴格的數據類型。 平安性 javascript是一種平安性語言,它不允許訪問本地的硬盤,并不能將數據存入到服務器上,不允許對網絡文檔進行修改和刪除,只能通過掃瞄器實現信息掃瞄或動態交互。從而有效地防止數據的丟失。 動態性的 javascript是動態的,它可以直接對用戶或客戶輸入做出響應,無須經過web服務程序。它對用戶的反映響應,是采納以大事驅動的方式進行的。所謂大事驅動,就是指在主頁(home page)中執行了某種操作所產生的動作,就稱為“大事”(event)。比如按下鼠標、移動窗口、選擇菜單等都

8、可以視為大事。當大事發生后,可能會引起相應的大事響應。 跨平臺性 javascript是依靠于掃瞄器本身,與操作環境無關,只要能運行掃瞄器的計算機,并支持javascript的瀏 javascript_入門教程,javascript_入門教程, 覽器就可正確執行。從而實現了“編寫一次,走遍天下”的幻想。 實際上javascript最杰出之處在于可以用很小的程序做大量的事。無須有高性能的電腦,軟件僅需一個字處理軟件及一掃瞄器,無須web服務器通道,通過自己的電腦即可完成全部的事情。 綜合所述javascript 是一種新的描述語言,它可以被箝入到 html 的文件之中。 javascript語言

9、可以做到回應使用者的需求大事 (如: form 的輸入) ,而不用任何的網路來回傳輸資料,所以當一位使用者輸入一項資料時,它不用經過傳給伺服端 (server)處理,再傳回來的過程,而直接可以被客戶端 (client) 的應用程式所處理。 javascript 和 java 很類似,但究竟并不一樣! java 是一種比 javascript 更簡單很多的程式語言,而 javascript 則是相當簡單了解的語言。javascript 創可以不那麼注意程式技巧,所以很多 java 的特性在 java script 中并不支援。 二、javascript和java的區分 雖然javascript與

10、java有緊密的聯系,但卻是兩個公司開發的不同的兩個產品。java是sun公司推出的新一代面對對象的程序設計語言,特殊適合于internet應用程序開發;而javascript是netscape公司的產品,其目的是為了擴展netscape navigator功能,而開發的一種可以嵌入web頁面中的基于對象和大事驅動的解釋性語言, 它的前身是live script;而java的前身是oak語言。下面對兩種語言間的異同作如下比較: 基于對象和面對對象 java是一種真正的面對對象的語言,即使是開發簡潔的程序,必需設計對象。 javascript是種腳本語言,它可以用來制作與網絡無關的,與用戶交互作

11、用的簡單軟件。它是一種基于對象(object based)和大事驅動(event driver)的編程語言。因而它本身供應了特別豐富的內部對象供設計人員使用。 解釋和編譯 兩種語言在其掃瞄器中所執行的方式不一樣。java的源代碼在傳遞到客戶端執行之前,必需經過編譯,因而客戶端上必需具有相應平臺上的仿真器或解釋器,它可以通過編譯器或解釋器實現獨立于某個特定的平臺編譯代碼的束縛。 javascript是一種解釋性編程語言,其源代碼在發往客戶端執行之前不需經過編譯,而是將文本格式的字符代碼發送給客戶編由掃瞄器解釋執行。 強變量和弱變量 javascript_入門教程,javascript_入門教程,

12、 兩種語言所實行的變量是不一樣的。 java采納強類型變量檢查,即全部變量在編譯之前必需作聲明。如: integer x; string y; x=1234; x=4321; 其中x=1234說明是一個整數,y=4321說明是一個字符串。 javascript中變量聲明,采納其弱類型。即變量在使用前不需作聲明,而是解釋器在運行時檢查其數據類型,如: x=1234; y4321; 前者說明x為其數值型變量,而后者說明y為字符型變量。 代碼格式不一樣 java是一種與html無關的格式,必需通過像html中引用外媒體那么進行裝載,其代碼以字節代碼的形式保存在獨立的文檔中。 javascript的代

13、碼是一種文本字符格式,可以直接嵌入html文檔中,并且可動態裝載。編寫html文檔就像編輯文本文件一樣便利。 嵌入方式不一樣 在html文檔中,兩種編程語言的標識不同,javascript使用script./script來標識,而java使用applet./applet來標識。 靜態聯編和動態聯編 java采納靜態聯編,即java的對象引用必需在編譯時的進行,以使編譯器能夠實現強類型檢查。 javascript采納動態聯編,即javascript的對象引用在運行時進行檢查,如不經編譯則就無法實現對象引用的檢查。 三、javascript程序運行環境 javascript_入門教程,javasc

14、ript_入門教程, 1.java運行環境 軟件環境: windows 95/98或windows nt。 netscape navigator x.0或internet explorer x.0。 用于編輯html文檔的字符編輯器(ws、wps、notepad、wordpad等)或html文檔編輯器。 硬件配置: 首先必需具備運行windows 95/98或windows nt的基本硬件配置環境。推舉: 基本內存32m。 crt只少需要256顏色,辨別率在640x480以上。 cpu只少233以上。 鼠標和其它外部設置(依據需要選用)。 四、編寫第一個javascript程序 下面我們通過一

15、個例子,編寫第一個javascript程序。通過它可說明javascript的腳本是怎樣被嵌入到html文檔中的。 test1.html文檔: html head script language =javascript / javascript appears here. alert(這是第一個javascript例子!); javascript_入門教程,javascript_入門教程, alert(歡迎你進入javascript世界!); alert(今后我們將共同學習javascript學問!); /script /head /html 在internet explore5.0中運行行后

16、的結果見圖所示。 圖 程序運行的結果 說明: test.html是html文檔,其標識格式為標準的html格式; 猶如html標識語言一樣, javascript程序代碼是一些可用字處理軟件掃瞄的文本,它在描述頁面的html相關區域消失。 javascript_入門教程,javascript_入門教程, javascript代碼由 script language =javascript./script說明。在標識script language =javascript./script之間就可加入javascript腳本 alert()是javascript的窗口對象方法,其功能是彈出一個具有ok

17、對話框并顯示()中的字符串 通過!- ./-標識說明:若不熟悉javascript代碼的掃瞄器,則全部在其中的標識均被忽視;若熟悉,則執行其結果。使用解釋這是一個好的編程習慣,它使其他人可以讀懂你的語言。 javascript 以 /script 標簽結束。 從上面的實例分析中我們可以看出,編寫一個javascript程序的確特別簡單的。 其次講 javascript基本數據結構 javascript供應腳本語言的編程與c+特別相像,它只是去掉了語言中有關指針等簡單產生的錯誤,并供應了功能強大的類庫。對于已經具備+或語言的人來說,學習javascript腳本語言是一件特別輕松開心的事。 一、j

18、avascript代碼的加入 javascript的腳本包括在html中,它成為html文檔的一部分。與html標識相結合,構成了一個功能強大的internet網上編程語言。可以直接將javascript腳本加入文檔: script language =javascript javascript語言代碼; javascript 語言代碼; . /script 說明: 通過標識script./script指明javascript腳本源代碼將放入其間。 javascript_入門教程,javascript_入門教程, 通過屬性language =javascript說明標識中是使用的何種語言,這里

19、是javascript語言, 表示在javascript中使用的語言。 下面是將javascript腳本加入web文檔中的例子: test2.html html head script language =javascript document. write(這是電腦報網絡學校); document. close(); /script /head /html 在掃瞄器的窗口中調用test2.html,則顯示“這是電腦報網絡學校”字串。見圖2所示。 javascript_入門教程,javascript_入門教程, 圖2 說明: document. write()是文檔對象的輸出函數,其功能是將括

20、號中的字符或變量值輸出到窗口;document. close()是將輸出關閉。 可將script./script標識放入head. /head或body ./body之間。將javascript標識放置head. /head在頭部之間,使之在主頁和其余部分代碼之前裝載,從而可使代碼的功能更強大;可以將javascript標識放置在body. /body主體之間以實現某些部分動態地創建文檔。 二、基本數據類型 javascript腳本語言同其它語言一樣,有它自身的基本數據類型、表達式和算術運算符以及程序的基本框架結構。javascript供應了四種基本的數據類型用來處理數字和文字, 而變量供應存

21、放信息的地方, 表達式則可以完成較簡單的信息處理。 1、基本數據類型 在javascript中四種基本的數據類型:數值(整數和實數)、字符串型(用“”號或括起來的字符或數值)、布爾型(使true或false表示)和空值。在javascript的基本類型中的數據可以是常量,也可以變量。由于javascript采納弱類型的形式,因而一個數據的變量或常量不必首先作聲明,而是在使用或 javascript_入門教程,javascript_入門教程, 賦值時確定其數據的類型的。當然也可以先聲明該數據的類型,它是通過在賦值時自動說明其數據類型的。 2、常量 整型常量 javascript的常量通常又稱字面

22、常量,它是不能轉變的數據。其整型常量可以使用十六進制、八進制和十進制表示其值。 實型常量 實型常量是由整數部分加小數部分表示,如12.32、193.98 。可以使用科學或標準方法表示:5e7、4e5等。 布爾值 布爾常量只有兩種狀態:true或false。 它主要用來說明或代表一種狀態或標志,以說明操作流程。它與是不一樣的,可以用或表示其狀態,而javascript只能用true或false表示其狀態。 字符型常量 使用單引號()或雙引號(“)括起來的一個或幾個字符。如 this is a book of javascript 、3245、ewrt234234 等。 空值 javascript

23、中有一個空值null,表示什么也沒有。如試圖引用沒有定義的變量,則返回一個null值。 特別字符 同語言一樣,javascript中同樣以有些以反斜杠()開頭的不行顯示的特別字符。通常稱為掌握字符。 3、變量 變量的主要作用是存取數據、供應存放信息的容器。對于變量必需明確變量的命名、變量的類型、變量的 javascript_入門教程,javascript_入門教程, 聲明及其變量的作用域。 變量的命名 javascript中的變量命名同其計算機語言特別相像,這里要留意以下兩點: 、必需是一個有效的變量,即變量以字母開頭,中間可以消失數字如test1、text2等。除下劃線()作為連字符外,變量

24、名稱不能有空格、()、()、(,)或其它符號。 、不能使用javascript中的關鍵字作為變量。 在javascript中定義了多個類鍵字,這些關鍵是javascript內部使用的,不能作為變量的名稱。如var、int、double、true不能作為變量的名稱。 在對變量命名時,最好把變量的意義與其代表的意思對應起來,以免消失錯誤。 變量的類型 在javascript中,變量可以用命令var作聲明: var mytest; 該例子定義了一個mytest變量。但沒有給予它的值。 var mytest=”this is a book” 該例子定義了一個mytest變量, 同時給予了它的值。 在j

25、avascript中,變量以可以不作聲明,而在使用時再依據數據的類型來確其變量的類型。 如: x=100 y=125 xy= true javascript_入門教程,javascript_入門教程, cost=19.5等。 其中x整數,y為字符串,xy為布爾型,cost為實型。 變量的聲明及其作用域 javascript變量可以在使用前先作聲明,并可賦值。通過使用var關鍵字對變量作聲明。對變量作聲明的最大好處就是能準時發覺代碼中的錯誤;由于javascript是采納動態編譯的,而動態編譯是不易發覺代碼中的錯誤,特殊是變量命名的方面。 對于變量還有一個重要性那就是變量的作用域。在javasc

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

27、avascript主要有雙目運算符和單目運算符。其雙目運算符由下列組成: 操作數運算符 操作數 即由兩個操作數和一個運算符組成。如5040、this+that等。單目運算符,只需一個操作數,其運算符可在前或后。 ()算術運算符 javascript_入門教程,javascript_入門教程, javascript中的算術運算符有單目運算符和雙目運算符。 雙目運算符: +(加) 、-(減)、 *(乘)、 /(除)、 %(取模) 、|(按位或)、(按位與)、(左移)、 (右移)、 (右移,零填充)。 單目運算符: -(取反)、(取補)、+(遞加1)、-(遞減1)。 ()比較運算符 比較運算符它的基

28、本操作過程是,首先對它的操作數進行比較,爾后再返回一個true或false值,有個比較運算符: (小于)、(大于)、=(小于等于)、=(大于等于)、=(等于)、!=(不等于)。 ()布爾規律運算符 在javascript中增加了幾個布爾規律運算符: !(取反)、=(與之后賦值)、 (規律與)、 |=(或之后賦值)、 |(規律或)、 =(異或之后賦值)、 (規律異或)、 ?:(三目操作符)、|(或)、=(等于)、|=(不等于)。 其中三目操作符主要格式如下: 操作數?結果:結果 若操作數的結果為真,則表述式的結果為結果,否則為結果。 四、范例 下面是一個跑馬燈效果的javascript文檔。 t

29、est2_1.html javascript_入門教程,javascript_入門教程, 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 = msg.substring(0, seq+1); seq+; if ( seq = len ) seq = spacelen; wind

30、ow.settimeout(scroll2();, interval ); else window.settimeout(scroll();, interval ); javascript_入門教程,javascript_入門教程, function scroll2() var out=; for (i=1; i=spacelen/space10.length; i+) out += space10; out = out + msg; len=out.length; window.status=out.substring(seq, len); seq+; if ( seq = len ) se

31、q = 0; ; window.settimeout(scroll2();, interval ); scroll(); /script body /body /html 本講介紹了javascript腳本是如何加入web頁面, 并學習了javascript語言中的基本數據類型、變量、常量、操作運算符等。從本講中的內容中可以看出,對于已經把握語言的人來說,學習javascript真是一件特別輕松開心的事。 javascript_入門教程,javascript_入門教程, javascript技術講座 第三講 javascript程序構成 javascript腳本語言的基本構成是由掌握語句、函數

32、、對象、方法、屬性等,來實現編程的。 一、程序掌握流 在任何一種語言中,程序掌握流是必需的,它能使得整個程序減小混亂,使之順當按其肯定的方式執行。下面是javascript常用的程序掌握流結構及語句: 、if條件語句 基本格式 if(表述式) 語句段; . else 語句段; . 功能:若表達式為true,則執行語句段;否則執行語句段。 說明: if -else 語句是javascript中最基本的掌握語句,通過它可以轉變語句的執行挨次。 表達式中必需使用關系語句,來實現推斷,它是作為一個布爾值來估算的。 它將零和非零的數分別轉化成false和true。 若if后的語句有多行,則必需使用花括號

33、將其括起來。 javascript_入門教程,javascript_入門教程, if(布爾值)語句; else(布爾值)語句; else if(布爾值)語句; else 語句; 在這種狀況下,每一級的布爾表述式都會被計算,若為真,則執行其相應的語句,否則執行else后的語句。 、for循環語句 基本格式 for(初始化;條件;增量) 語句集; 功能:實現條件循環,當條件成立時,執行語句集,否則跳出循環體。 說明: 初始化參數告知循環的開頭位置,必需給予變量的初值; 條件:是用于判別循環停止時的條件。若條件滿意,則執行循環體,否則 跳出。 增量:主要定義循環掌握變量在每次循環時按什么方式變化。

34、三個主要語句之間,必需使用逗號分隔。 javascript_入門教程,javascript_入門教程, 基本格式 while(條件) 語句集; 該語句與for語句一樣,當條件為真時,重復循環,否則退出循環。 for與while語句 兩種語句都是循環語句,使用for語句在處理有關數字時更易看懂,也較緊湊;而while循環對簡單的語句效果更特殊。 、break和continue語句 與c+語言相同,使用break語句使得循環從for或while中跳出,continue使得跳過循環內剩余的語句而進入下一次循環。 二、函數 函數為程序設計人員供應了一個豐常便利的力量。通常在進行一個簡單的程序設計時,總

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

36、字。 參數表,是傳遞給函數使用或操作的值,其值可以是常量 ,變量或其它表達式。 通過指定函數名(實參)來調用一個函數。 必需使用return將值返回。 函數名對大小寫是敏感的。 、函數中的形式參數: 在函數的定義中,我們看到函數名后有參數表,這些參數變量可能是一個或幾個。那么怎樣才能確定參數變量的個數呢?在javascript中可通過arguments .length來檢查參數的個數。例: function function_name(exp1,exp2,exp3,exp4) number =function _name . arguments .length; if (number1) document.wrile(e

溫馨提示

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

評論

0/150

提交評論