版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領
文檔簡介
1、文檔從互聯網中收集，已重新修正排版，word格式支持編輯，如有幫助歡迎下載支持。Javascript基礎知識學習目標Javascript編程基礎Javascript工作原理如何在html頁面中使用javascript(數據類型、變量、常量、運算符、表達式、控制流程、數組、函數)Javascript事件處理對象和系統函數瀏覽器對象什么是 javascriptJavascript是Netscape公司開發的一種腳本語言。該語言編寫的程序可以被嵌入到html 頁面中，并直接在瀏覽器中解釋執行。Javascript 功能(1)增強頁面動態效果(2)實現頁面與用戶之間的實時、動態交互Javascript
2、語言特點腳本語言(script language)解釋執行(interpreted language)基于對象(object based)事件驅動(event driven)簡單弱類型(weakly typed language)Javascript嵌入到html頁而中在 html頁面 中使用script標記嵌 入腳本 代碼© <script language ="/javscript/>type=/,text/javascriptz,</script>Javascript代碼的出現位置(1) Html頁而主體部分(<body>)(2)
3、Html 頁而頭部(<head>)單獨的外部文件<script language="javascript" src="外部腳本文件”></script> 3.html數據類型Javascript支持基本數據類型和對象類型 (1)基本數據類型整形浮點型字符型布爾型(2)對象類型內置對象(string math date)瀏覽器對象(window document history form )用戶自定義對象變量(1)命名規則：< 1>必須以字母、下劃線或美元符號開頭，后面可以跟字母、下劃線、美元符號、數字< 2&g
4、t;變量名要區分大小寫< 3>不允許使用javascript關鍵字做變量名。< 4>使用var聲明變量，變量聲明時不指定具體數據類型，其具體數據類型由給其賦的值 決定°也可以不經聲明而直接使用變量，但必須先賦值再取值.Javascript 關鍵字被賦值以定特含義字符，并用于專門的用途Break continue switch case delete function return typeof if else var try catch throw finally in this void false true instanceof do while debu
5、gger new with default for null常量整形常量十進制表示：12十六進制表示：0x12八進制表示：012浮點常量3.14布爾型常量true字符型常量看"abc"空值常量:null例子5.htmlJavascript 運算符算數運算符：+-*/+-邏輯運算符：&與|或！非A異或比較運算符：>,>=,<=,!=,=,=完全相同位運算符：取反&按位與I按位或八按位異或 <<左移”帶符號右移 >>>無符號右移 賦值運算符：=擴展賦值運算符：+= -= *= /= %= != &= |=
6、A= «= »= »>=三目運算符：()?：字符串連接：+ += 表達式表達式是符合一定語法規則的運算符和操作數的序列。表達式的類型和值：對表達式中操作數進行運算得到的結果就稱為表達式的值表達式值的數據類型就是表達式的類型表達式的運算順序：(1)按照運算符的優先級從高到低進行運算。(2)優先級相同的運算符按照事先預定的接合方向進行運算程序控制流程分支語句If else例子6.htmlSwith 7.html循環語句For循環While循環Do-while 循環For-in循環特殊流程控制語句Break跳出循環Continue結束本次循環，繼續下次循環數組是多
7、個相同類型數據的組合，實現對數據的統一管理。Javascript數組的聲明方式：Var a = new Array();Var b = new Array(size);Var c = new Array(vl,v2,v3,.);Javascript數組長度可變，數組對象的length屬性表明了該數組的長度。數組元素訪問格式: 數組名元素下標有效元素下標的范圍：Olength-l; sort();Shift:刪除數組的第一項，并返回刪除元素的值；如果數組為空則返回undefined.Unshift:將元素添加到數組的開頭，并返回數組的長度Pop刪除數組的最后一項的值，如果數組為空則返回undef
8、ined.Push將數組添加到數組的尾部，并返回數組的長度Concat返回一個新的數組，將數組添加到原數組中Reverse:數組反轉 a.reverse()Sort:排序Slice (start, end)截取Join （separator）將數組的元素以separator為分隔符組成新的字符串，如果缺省的話以逗號 戢Javascript中的函數（Function）,是用來完成相對獨立功能的一段代碼的集合。格式：Function v函數名（v形參列表）函數體return語句函數在定義時不需要指定其返回值類型和是否有返回值類型例子 ll.html事件及事件處理機制1 .事件（event）用于描述
9、發生了什么事情，用戶的鼠標或鍵盤操作（點擊，文字輸入，下拉框的選中） 以及其他的頁而操作（頁面的加載和卸載）都會觸發相應的事件。2 .事件源（event source）可能產生事件的組件，一般網頁中為表單組件3 .事件驅動（event driven）有事件引發程序的響應，執行事先準備好的事件處理代碼，這種程序運行方式稱為事件 驅動。4 .事件處理代碼（event handle）Javascript中事件處理代碼通常定義為函數的形式，在其中加入所需要的處理邏輯，并將 之關聯到所關注的事件源組件上。常用的事件類型OnClick組件被點擊onDbClick組件被雙擊onLoad頁而加載onUnloa
10、d頁而卸載onChange組件內容發生變化或條目選中狀態發生變化onMouseMove鼠標移動onFocus獲得焦點onBlur失去焦點例子 12.htmlJavascript常用對象1、數學對象Math（靜態對象）Math對象的屬性：PI圓周率,E自然對數Math對象的方法：Ceil（數值）大于該數值的最小整數向上取整Floor（數值）向下取整Min（數值1 ,數值2）最小值Max（數值1 ,數值2）最大值Pow（數值1 ,數值2）數值1的數值2次方Random（）0到1的隨機數Round（數值）四舍五入到整數Sqrt（數值）開平方根Abs()z sin(), cos(),.例子 14.ht
11、ml2.時間對象封裝了日期和時間信息，并提供相關的操作功能。使用前需要聲明/創建對象：Var curtime = new date();如下的相關方法：得到時間的方法：Getyear()返回年份Getfullyear()Getmonth()返回月份Getdate()返回日期Getday()返回星期幾getHours()返回小時數getMinutes()返回分鐘數getSeconds。返回秒數getTime()返回整個時間設置時間的方法：setyear()設置年份setmonth()設置月份setdate()設置日期setHours()設置小時數setMinutes()設置分鐘數setSecon
12、ds()設置秒數setTi me()設置整個時間轉換時間的方法：Tolocalestring()lEl date對象轉換成本地格式的時間字符串 例子 15.html3、字符串對象String對象描述處理文本字符串信息創建string對象的語法New string(s);屬性Length字符串長度方法：charAt(idx)返回指定下標的字符indexof(chr)返回字符所在的位置indexof(chr,idx)lastindexof(chr)substring(m,n)從m位置截取到n位置的字符串substring ( m)從m截取到字符串最后 substr(m,n)從m位置截取n個長度的字
13、符串 tolowercase ()轉成小寫touppercase。轉成大寫search(str)檢索與正則表達式匹配的值*match(str)找到一個或多個正則表達式的匹配。如果沒有找到str,返回null；如果找到， 則返回一個數組。FghjkllhggReplace(strl,st替換與正則表達式strl匹配的子字符串str2Split。把子字符串分割成數組Sub() sup()例子 16.htmlRegexp對象創建正則表達式的對象語法：Var p = new regexp(patternzattributes);Var p = /pattern/attributes;參數pattern
14、是一個字符串，指定了正則表達式的模式或其他正則表達式。Attributes是一個可選的字符串，包含的屬性"g ”(全局匹配)，“i”(區分大小寫匹配) 和“m”(多行匹配),注:如果pattern部分是正則表達式,而不是字符串的話,則該參 數必須省略。匹配方法：Test。方法：regexp對象實例.test(字符串)返回值：如果regexp對象實例中規定的正則規則時，返回true,否則返回false：Exec ()方法：regexp對象實例.exec(字符串)返回值:如果exec方法中沒有找到匹配，則返回null,如果找到匹配則返回一個數組并且 更新全局regexp對象的屬性，以反應
15、匹配結果。數組的。元素包含了完整的匹配，從第 1到n元素中包含的是匹配中出現的任意一個子匹配字符串例子 17.html系統函數系統函數不屬于任何對象，可以在JAVASCRIPT代碼中的任何位置直接使用Eval(str)計算字符串形式給出的表達式的值。Parseint(str)將字符串轉成int型Parseint(str,radix)radix 表示進制數將字符串形式的數值解析為整數，如果解析到字符串中間遇到非法字符則返回已解析的內容, 而不是出錯，如果字符串開頭的第一個就是非法字符的話，則返回nan (非數值類型not a Number)Parsefloat (str)將字符串形式的數值解析為
16、浮點數Isnan (v)判斷該數的值是否為nan瀏覽器對象瀏覽器對象屬于javascript內置對象，使用這些對象可以實現與html頁而進行交互。 瀏覽器對象的層次模型windownavigarorlocationdocumentformelementsDOM 模型（document object model,文檔對象）Window對象表示是瀏覽器的窗口。(1)可以使用window對象來獲取瀏覽器窗口的狀態信息，也可以通過它來訪問其他瀏覽器 對象及窗口發生的事件信息(2) Window對象是其他瀏覽器對象的共同祖先，所以一般在javascript程序中可以省略 window對象 瀏覽器打開ht
17、ml文檔時，通常創建一個window對象。Window對象常用方法Alert(object)Open(url,windowname,parameterlist)補充說明:Parameterlist參數列表的內容Toolbar = yes/no 標準工具條location = yes/no位置輸入字段directions = yes/no 標準目錄按鈕status = yes/no 狀態條menubar = yes/no 菜單條scrollbar = yes/no 滾動條revisable = yes/no能否改變窗體的大小width =值窗口的寬度height =值窗口的高度top=值窗口的頂
18、部距離屏幕的距離left=值 窗口的左部距離屏幕的距離ClosedPrompt(text,defaulttext)Confirm(text) Setintervalffuncimer) Clearinterval(timer) Opener 例子 18.htmlNavigator對象是window對象的屬性，它封裝了當前瀏覽器的相關信息appname瀏覽器名稱Appversion瀏覽器的版本號Language瀏覽器使用的語言System language 系統語言Userlanguage用戶語言Platform操作系統平分例子 20.htmlLocation 對象Location對象是wind
19、ow對象的屬性，表示.當前打開的URL,提供的相關的操作方法。Location對象的常用屬性和方法：Window.location ="url"指向目標頁面Reloadf)刷新，重加載例子 21.htmlHistory 對象History對象是window對象的屬性，主要封裝了當前瀏覽器曾經訪問過的網頁信息，并提供 了相應的訪問和頁面跳轉功能。History對象的主要屬性和方法：Go (index)前進或后退指定多個頁而Back ()后退一個頁而Forward ()前進一個頁而例子 22.htmlDocument 對象Document對象是window對象的屬性，它表示的是
20、當前顯示的文檔，其中封裝了文檔中元 素的相關信息，并提供了相應的操作功能。Document.title設置文檔標題等價于title標簽Document.Write()Dom結構圖以'。點的形式存儲數據Window-navigator-plugins-mime types-frames-location-History-window objectsfseltparent)-document-forms-elements-images-embeds-links-anchors 口-appllets對象屬性Document.bgcolor 背景顏色Document.fgcolor前景顏色(文
21、本顏色)Document.linkcolor未點擊的連接顏色Document.alinkcolor焦點在連接上的顏色Document.vlinkcolor點擊過后的連接顏色Document.charset 字符集Document.cookie 設置和讀取 cookie常用方法Document.write()Document.createElement(Tag)創建一個 html 標簽對象.Document.getElementByld(id)獲取指定 id 值的對象Document.getElementsByName(name)獲取指定 name 值的對象Document.body /<
22、bodyx/body>在<body>文本內容v/body><body>HTML 代碼</body>；綁定一個對象到正文部分常用事件DOM (document object model)文檔對象模型Dom樹結構：Document最頂層的1點，其他行點都附屬于它。DocumentType DTD 弓| 用行點DocumentFragment 碎片文檔Element表示起始標簽到結束標簽之間的內容Attr表示屬性名和內容Text表示標簽之間的文本內容CDataSection 打點Entity Entity定義節點EntityReference實體引用節
23、點Processinginstruction PI 17 點Comment注釋節點Notation DTD規范中定義的記號創建行點的方法CreateElement (tagname)創建一個標簽名為tagname的元素CreateTextNode(text)創建一個包含文本text的文本門點appendChild(對象)添加節點removeChild(節點對象)刪除節點對象刪除當前節點的子行點，返回刪除的行點。這個被刪除 的節點可以被插入到其他地方。節點的parentNode特性replaceChild(節點1,節點2)用節點1替換節點2insertBefore(節點1,節點2)在節點2之前插入i'i點1cloneNode(deepBoolean)復制節點，復制了原行點的屬性，在把這個新汽點插入到document 前需要修改ID屬性確保ID值唯一。布爾參數deepBoolean為true時，復制當前節點的所有 子節點，包括節點內的文本var phtml = document. documentElement;va
溫馨提示
- 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯系上傳者。文件的所有權益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
- 4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
- 5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
- 6. 下載文件中如有侵權或不適當內容，請與我們聯系，我們立即糾正。
- 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
評論
0/150
提交評論