JavaScript面試總結(jié).docx

1.JavaScript1.1.介紹:嵌入式腳本語言，瀏覽器執(zhí)行，它是以字符串解析執(zhí)行的，它是一種基于對象的語言，不具有封裝,繼承,多態(tài)等特點。1.2.核心：1.事件，2.對象(Bom,Dom).1.3.js是事件驅(qū)動語言：1.區(qū)分大小寫.2.每句話后分號可有可無(最好有).3.注釋和java一樣.4.弱類型語言.1.4.有兩種數(shù)據(jù)類型： 1.原始數(shù)據(jù)類型：放在棧里的簡單數(shù)據(jù)類型(值在變量的地址).(boolean,String,undefind,null,Number.) 2.引用數(shù)據(jù)類型：放在堆里的復(fù)雜數(shù)據(jù)類型. 2.Array對象-提供對創(chuàng)建任何數(shù)據(jù)類型的數(shù)組的支持。2.1.concat 方法 (Array)-返回一個新數(shù)組，這個新數(shù)組是由兩個或更多數(shù)組組合而成的。2.2.join 方法-返回字符串值，其中包含了連接到一起的數(shù)組的所有元素，元素由指定的分隔符分隔開來2.3.pop 方法-移除數(shù)組中的最后一個元素并返回該元素2.4.shift 方法-移除數(shù)組中的第一個元素并返回該元素。2.5.unshift 方法-將指定的元素插入數(shù)組開始位置并返回該數(shù)組。2.6.push 方法-將新元素添加到一個數(shù)組中，并返回數(shù)組的新長度值。結(jié)束位置2.7.slice 方法 (2,4)-返回一個數(shù)組的一段。2.8.splice 方法-從一個數(shù)組中移除一個或多個元素，如果必要，在所移除元素的位置上插入新元素，返回所移除的元素。2.9.toLocaleString 方法-返回一個日期，該日期使用當(dāng)前區(qū)域設(shè)置并已被轉(zhuǎn)換為字符串。 3.Boolean 對象-創(chuàng)建新的 Boolean 值。 4.Date對象-啟用基本存儲器并取得日期和時間 5.Error對象-保存有關(guān)錯誤的信息。 6.Global 對象-把所有全局方法集中在一個對象中.6.1.escape(str) 方法-對 String 對象編碼以便它們能在所有計算機上可讀，;6.2.unescape(str) 方法-解碼用 escape 方法進行了編碼的 String 對象。6.3.eval 方法-檢查 JScript 代碼并執(zhí)行. eval(codeString),這個字符串將由 JScript 分析器進行分析和執(zhí)行6.4.isNaN 方法-返回一個 Boolean 值，指明提供的值是否是保留值 NaN （不是數(shù)字）。 7.Math 對象-是一個固有對象，提供基本數(shù)學(xué)函數(shù)和常數(shù)。7.1.alert(Math.round(1.5); /四舍五入 8.Number 對象-代表數(shù)值數(shù)據(jù)類型和提供數(shù)值常數(shù)的對象。 9.String 對象-可用于處理或格式化文本字符串以及確定和定位字符串9.1.在每個空格字符處進行分解。-var ss = s.split(-); 10.typeof 返回原始值類型10.1.typeof 運算符把類型信息當(dāng)作字符串返回。typeof 返回值有六種可能：number, string, boolean, object, function, 和 undefined. 11.instanceof 判斷對象類型 12.this表示:永遠都指向調(diào)用它的那個對象-不加this,undefined - this . 13.prototype原型13.1.prototype 屬性提供對象的類的一組基本功能。 對象的新實例“繼承”賦予該對象原型的操作。 14.定義方法的方式：結(jié)構(gòu)體,對象引用(定義是私有的),通過原型(定義是公共的)14.1.結(jié)構(gòu)體 function pe().1.1-pe = function()1.2-HashMtotype = size :function()return this.elements.length;,put.14.2.對象引用 s1.q1 = function()alert(I am q1.);14.3.原型 totype.fun1 = function()alert(我是原型220); 1.constructor:對創(chuàng)建對象構(gòu)造器的引用var date = new Date();var d = date.constructor;var ss = new d();/alert(ss.getDay(); 2.StringBufferappend-push(value);toString-join(,);以及在Java 里面StringBuffer與String的區(qū)別 3.className-p標(biāo)簽顏色改變,引用cssp.className=oa; -css 里面.oa; 4 4.1-getElementsByTagName-獲得目標(biāo)對象. var img = document.getElementsByTagName(img); 4.2-getElementById-通過id獲得標(biāo)簽對象 var p = document.getElementById(pa); 5.arguments-類似于數(shù)組, 但是不能用join(); length屬性表示參數(shù)列表的長度.- 方法重載 66.1-clearInterval 使用 setInterval 方法取消先前開始的間隔事件。 6.2-clearTimeout 取消先前用 setTimeout 方法設(shè)置的超時事件。 6.3-setInterval 每經(jīng)過指定毫秒值后計算一個表達式。 6.4-setTimeout 經(jīng)過指定毫秒值后計算一個表達式。 7.定義對象的三種方式/1.var obj = new Object(); = 123d;/alert();/2.var obj = x:123123,y:aaa;alert(obj.y);/3。function point() 8.動態(tài)創(chuàng)建span對象document.createElement(span);span.innerText=.;span.attachEvent(onclick,fn);/把span對象追加到div后面var div = document.getElementById(sss);div.appendChild(span); 9.圖片顯示var img = document.createElement(img);body.appendChild(img); /動態(tài)創(chuàng)建img對象i = window.setInterval(fun(),1000);定義一個變量 i進行 window.clearTimeout(i) 控制暫停.onmouseover 當(dāng)用戶將鼠標(biāo)指針移動到對象內(nèi)時觸發(fā)。onmouseout 當(dāng)用戶將鼠標(biāo)指針移出對象邊界時觸發(fā)。 10.計時器,HashMap. 1.document.cookie -短期-關(guān)閉瀏覽器,cookie結(jié)束,長期-存于本地1.1.介紹：JavaScript中的另一個機制：cookie，則可以達到真正全局變量的要求。cookie是瀏覽器 提供的一種機制，它將document 對象的cookie屬性提供給JavaScript?？梢杂蒍avaScript對其進行控制.(cookie文件存儲于documents and settingsuserNamecookie文件夾下)1.2.可以作為全局變量，這是它最大的一個優(yōu)點.用于: 1.2.1.保存用戶登錄狀態(tài)。例如將用戶id存儲于一個cookie內(nèi)，這樣當(dāng)用戶下次訪問該頁面時就不需要重新登錄了. 1.2.2.跟蹤用戶行為,例如一個天氣預(yù)報網(wǎng)站，能夠根據(jù)用戶選擇的地區(qū)顯示,當(dāng)?shù)氐奶鞖馇闆r上次用戶所在地區(qū)的天氣情況. 1.2.3.定制頁面。如果網(wǎng)站提供了換膚或更換布局的功能，那么可以使用cookie來記錄用戶的選項.背景,分辨率. 1.2.4.創(chuàng)建購物車。正如在前面的例子中使用cookie來記錄用戶需要購買的商品一樣，在結(jié)賬的時候可以統(tǒng)一提交。例如淘寶網(wǎng)就使用cookie記錄了用戶曾經(jīng)瀏覽過的商品，方便隨時進行比較。 1.3.cookie的缺點主要集中于安全性和隱私保護。主要包括以下幾種： 1.3.1.cookie可能被禁用。當(dāng)用戶非常注重個人隱私保護時，他很可能禁用瀏覽器的cookie功能； 1.3.2.cookie是與瀏覽器相關(guān)的。這意味著即使訪問的是同一個頁面，不同瀏覽器之間所保存的cookie也是不能互相訪問的 1.3.3.cookie可能被刪除。因為每個cookie都是硬盤上的一個文件，因此很有可能被用戶刪除； 1.3.4.cookie安全性不夠高。所有的cookie都是以純文本的形式記錄于文件中，因此如果要保存用戶名密碼等信息時，最好事先經(jīng)過加密處理。 1.4.設(shè)置cookie 每個cookie都是一個名/值對，可以把下面這樣一個字符串賦值給document.cookie： document.cookie=userId=828;/document.cookie =key+=+value+;expires=+date.toGMTString(); 2.insertRow.主要用到的方法有： var tr = table.insertRow();/插入行. var td = tr.insertCell();/插入列. td.innerText = +i;/置或獲取位于對象起始和結(jié)束標(biāo)簽內(nèi)的文本。 tr.appendChild(td);/列加入指定行. table.appendChild(tr);/行加入指定表格. !this是button對象button.td(parentNode).tr.table .removeChild(button.td.tr); -刪除指定行. 3.new操作1.當(dāng)解析器遇到new 并操作的時候創(chuàng)建空對象.2.開始運行A()函數(shù)，并將this指針指向新建的對象.3.當(dāng)給對象不存在的屬性賦值的時，解析器就會為該對象創(chuàng)建該屬性.這樣A()函數(shù)的執(zhí)行就是初始化空對象的過程.4.當(dāng)函數(shù)執(zhí)行完成以后,new操作符就會返回該對象.(早綁定,晚綁定) 4.繼承1.構(gòu)造繼承 1.1.this.newMethod = A;/將A的地址（引用）賦給newMethod.-A為父類this.newMethod(admin,永州);/繼承屬性（方法）到this關(guān)鍵字里面.獲取子類的實例調(diào)用父類的方法.2.冒充繼承call 2.1.父類.call(子類對象，parmers.);.3.冒充繼承apply 3.1.父類.apply(子類對象，Array).4.原型繼承 4.1.E.prototype = new A(lishi,北京);-A為父類,E為子類,.5.copy繼承 5.1 G.prototype.method1 = F.prototype.method1; /F為父類 5.2 for(var par in F.prototype) /1.1種方式. G.prototypepar = F.prototypepar; 5.3 var str = method1;G.prototypestr = F.prototypestr; 5.計算器. 6.冒泡排序. 正則表達 1.作用 1.1.測試字符串的某個模式(電話號碼模式或一個信用卡號碼). 1.2.替換文本. 1.3.根據(jù)模式匹配從字符串中提取一個子字符串?？梢杂脕碓谖谋净蜉斎胱侄沃胁檎姨囟ㄎ淖?2.語法 由普通字符（例如字符 a 到 z）以及特殊字符（稱為元字符）組成的文字模式1.量詞 ? 零次或一次 * 零次或多次 + 一次或多次 n匹配n次 n, 至少n次 n,m n到m次 (mn).2.預(yù)定義類(系統(tǒng)已經(jīng)做好了的.) s 匹配一個空白字符 nrtfx0B w 數(shù)字,字母,下劃線 a-zA-Z0-9_ d 數(shù)字 0-9 S 匹配一個非空白字符 nrtfx0B W 非數(shù)字,字母,下劃線 a-zA-Z0-9_ D 非數(shù)字 0-93.選項標(biāo)志 可以組合使用. g 全文查找. i 忽略大小寫. m 多行查找.4.其他 轉(zhuǎn)義字符 匹配輸入字符串的開始位置. 取反. $ 匹配輸入字符串的結(jié)束位置. . 一個任意字符.5.兩種聲明方式 1,new 一個RegExp var reg = new RegExp(); RegExp是一個對象,和Array一樣 var reg = new RegExp(a,gi); 匹配所有的a或A 2,字面量的聲明方式/d+/ /u4e00-u9fa52,/ 驗證漢字 3.正則表達式對象的方法及使用 1.test,返回一個 Boolean 值，它指出在被查找的字符串中是否存在模式。如果存在則返回 true，否則就返回 false。 reg.test(str); 2.exec,用正則表達式模式在字符串中運行查找，并返回包含該查找結(jié)果的一個數(shù)組。只要匹配的到的話就直接取出bin返回reg.exec(str); 3.compile,把正則表達式編譯為內(nèi)部格式，從而執(zhí)行得更快。 4.match，它就是將所有匹配的內(nèi)容，以數(shù)組的形式全部返回.str.match(reg); 5.元字符 匹配正則表達式本身時，必須對這些元字符轉(zhuǎn)義. /?( $ | ) ? * + .var re = /?/;/將匹配? re = new RegExp(?);/正確，將匹配？/雙重轉(zhuǎn)義 脫字符 ,$ var reg = /as/gi;/表示必須要以as開頭. 6.簡單類(字符類) var re = /abc123/;/將匹配abc123這6個字符中一個 只要有一個就可以了 7.反向類 re = /abc/;/將匹配除abc之外的一個字符 8.范圍類 re = /a-z/;/將匹配小寫a-z 26個字母 9.組合類 re = /a-z0-9A-Z_/;/將匹配字母，數(shù)字和下劃線 10.預(yù)定義類. s,S w,W d,D 分組 var reg = /(a-z+)(s+)d+/; 創(chuàng)建的兩種方式1.var reg = new RegExp(as,gi);2.var reg = /as/gi;其他 1.replace() 替換 str.replace(/-+/g,*) str.replace(/s+/g,)去空格. 2.split() 拆分 str.split(/d/) 對數(shù)字進行拆分. 3.search(); 找位置str.search(/d/),找數(shù)字出現(xiàn)的位置, 4.str.indexOf(1) 找位置 /不能放正則表達式 4.貪婪量詞與惰性量詞1.貪婪量詞:如果是整個匹配就直接將全部的返回，要是整體不匹配就從后往前匹配,直到碰到不匹配的， 就將匹配到的返回，繼續(xù)匹配剩下的.(+,?,*,n,n,n,m); var str = abb#asdfdbbbsaiouisbbb; var reg1 = /w+bbb/; /w+bbb表示一個或多個字母或數(shù)字,下劃線加上bbb. /alert(reg1.exec(str)+|+n+str.match(reg1);/asdfdbbbsaiouisbbb /匹配了繼續(xù)匹配剩下的.2.惰性量詞:?它首先將第一個字符當(dāng)成一個匹配，如果成功則退出，如果失敗，則測試前兩個字符， 依些增加，直到遇到合適的匹配為止.(+?,?,*?,n?,n,?,n,m); var str = absdbas*dfdbbbsaisdfouisbbb; var reg1 = /w+?bbb/; /-匹配到了就不在匹配了 /alert(reg1.exec(str)+|+n+str.match(reg1);/dfdbbb 閉包1.介紹:調(diào)用函數(shù),返回函數(shù).閉包有返回,返回的是最終值.2.作用:閉包保護棧,保護資源.3.特點 1.作為一個函數(shù)變量引用.當(dāng)函數(shù)返回時,處于激活狀態(tài). 2.閉包就是當(dāng)一個函數(shù)返回時,一個沒有釋放資源的棧區(qū). 動態(tài)插入表格 全JavaScript.首先調(diào)用init(隨便定義的方法)方法. BOM 瀏覽器對象模型(地址欄上面的)1.什么是BOM?(BOM體系結(jié)構(gòu)圖) 1.BOM是Browser Object Model的縮寫，簡稱瀏覽器對象模型 2.BOM提供了獨立于內(nèi)容而與瀏覽器窗口進行交互的對象 3.由于BOM主要用于管理窗口與窗口之間的通訊，因此其核心對象是window 4.BOM由一系列相關(guān)的對象構(gòu)成，并且每個對象都提供了很多方法與屬性 5.BOM缺乏標(biāo)準(zhǔn)，JavaScript語法的標(biāo)準(zhǔn)化組織是ECMA，DOM的標(biāo)準(zhǔn)化組織是W3C. 6.BOM最初是Netscape瀏覽器標(biāo)準(zhǔn)的一部分2.BOM的作用 BOM提供了一些訪問窗口對象的一些方法，我們可以用它來移動窗口位置，改變窗口大小，打開新窗口和關(guān)閉窗口， 彈出對話框，進行導(dǎo)航以及獲取客戶的一些信息如：瀏覽器品牌版本，屏幕分辨率。 但BOM最強大的功能是它提供了一個訪問HTML頁面的一入口document對象， 以使得我們可以通過這個入口來使用DOM的強大功能！3.window對象. 1.window對象是BOM中所有對象的核心.window還可用于移動或調(diào)整它表示的瀏覽器的大小 2.window子對象 document 對象,frames 對象,history 對象,location 對象,navigator 對象,screen 對象. 3.window對象關(guān)系屬性 parent：如果當(dāng)前窗口為frame，指向包含該frame的窗口的frame （frame） self ：指向當(dāng)前的window對象，與window同義。 （window對象） top ：如果當(dāng)前窗口為frame，指向包含該frame的top-level的window對象 window ：指向當(dāng)前的window對象，與self同意。 opener ：當(dāng)窗口是用javascript打開時，指向打開它的那人窗口（開啟者）4.window對象的方法 1.窗體控制 moveBy(x,y)從當(dāng)前位置水平移動窗體x個像素，垂直移動窗體y個像素，x為負數(shù)，將向左移動窗體，y為負數(shù)，將向上移動窗體 moveTo(x,y)移動窗體左上角到相對于屏幕左上角的(x,y)點，當(dāng)使用負數(shù)做為參數(shù)時會吧窗體移出屏幕的可視區(qū)域 resizeBy(w,h)相對窗體當(dāng)前的大小，寬度調(diào)整w個像素，高度調(diào)整h個像素。如果參數(shù)為負值，將縮小窗體，反之?dāng)U大窗體 resizeTo(w,h)把窗體寬度調(diào)整為w個像素，高度調(diào)整為h個像素 2.窗體焦點控制 focus() 使窗體或控件獲取焦點 blur()與focus函數(shù)相反，使窗體或控件失去焦點 3.新建窗體 open()打開(彈出)一個新的窗體window.open(url, name, features, replace); close()關(guān)閉窗體 opener屬性新建窗體中對父窗體的引用，中文開啟者的意思5.對話框 alert(str) 彈出消息對話框（對話框中有一個“確定”按鈕） confirm(str) 彈出消息對話框（對話框中包含一個“確定”按鈕與“取消”按鈕） prompt(str,defaultValue)彈出消息對話框（對話框中包含一個“確定”按鈕、“取消”按鈕與一個文本輸入框）6.Location 對象 -jsp頁面進行數(shù)據(jù)傳送window.location.href = 3_success.html#id=123,name=sss; 1.hash 設(shè)置或返回從井號 (#) 開始的 URL（錨）var str = window.document.location.hash; 2.search 設(shè)置或返回從問號 (?) 開始的 URL（查詢部分）var str = window.document.location.search;7.Navigator對象 1.appName 返回瀏覽器的名稱 2.appVersion 返回瀏覽器的平臺和版本信息.8.框架 alert(frames.length);/框架的數(shù)目 alert(frames0.document.body.innerHTML);/使用下標(biāo)直接獲取對框架中窗口的引用 /不但可以使用下標(biāo)，還可以使用frame標(biāo)簽的name屬性 alert(framesframe1.document.title);在框架集中還可以使用ID來獲取子窗口的引用 var frame1 =document.getElementById(frame1);/這樣只是獲取了標(biāo)簽 var frame1Win = frame1.contentWindow;/frame對象的contentWindow包含了窗口的引用 /還可以直接獲取框架中document的引用 var frameDoc = frame1.contentDocument; alert(frameDoc);/但IE不支持contentDocument屬性子窗口訪問父窗口window對象的parent屬性子窗口訪問頂層window對象的top屬性 IFrame可以局部刷新 DOM 文本對象模型(地址欄下面的范圍框里面的) 通過正則表達式對輸入框進行校驗,利用焦點事件(onblur 在對象失去輸入焦點時觸發(fā)。) DOM 文本對象模型1.什么是DOM? 1.Document Object Model (DOM)是HTML和XML文檔的編程接口。它提供了上述文檔的一種結(jié)構(gòu)化表示， 同時也定義了一種通過程序來改變文檔結(jié)構(gòu)，風(fēng)格，以及內(nèi)容的方式。DOM用一組結(jié)構(gòu)化的節(jié)點以及對象來表示文檔。 本質(zhì)上就是將網(wǎng)頁和腳本語言以及編程語言連接起來。 2.DOM是網(wǎng)頁的一種完全的面向?qū)ο蟮谋硎痉椒?，可以通過腳本語言（比如說JavaScript）來改變。 DOM標(biāo)準(zhǔn)主要要為：微軟DOM與W3C DOM，一般IE實現(xiàn)的是微軟DOM，而其它瀏覽器則不同程度的實際了W3C DOM2.DOM發(fā)展史-. DOM Level Zero ,事實上從來不存在DOM 0版本，只是人們的戲稱。 DOM Level 1 包括DOM Core和DOM HTML。前者提供了基于XML的文檔結(jié)構(gòu)圖。 DOM Level 2 引入幾個新模塊：DOM視圖，事件，樣式，遍歷和范圍。IE只實現(xiàn)了一部分，火狐瀏覽器幾乎全部實現(xiàn)， DOM Level 3 引入了以統(tǒng)一的方式載入和保存文檔的方法(firefox只實現(xiàn)了一部分)。 API（網(wǎng)頁或者XML頁面）DOM JS（腳本語言）3.DOM與BOM關(guān)系結(jié)構(gòu)圖,文檔對象模型-DOM,樹型結(jié)構(gòu)圖.(BOM包括DOM)4.document有三個方法，可以獲取頁面的任何元素. 對三種獲取頁面元素方法的使用： 1.getElementById /通過ID獲取對象var sss = document.getElementById(ddd);/alert(sss); 2.getElementsByName /通過name獲取對象var sss=document.getElementsByName(firstName);/alert(sss1.value); 3.getElementsByTagName /通過目標(biāo)獲取對象var sss = document.getElementsByTagName(*); /*代表所有的節(jié)點元素./alert(sss.length); /火狐和IE所輸出的length值不同.for(var i =0;isss.length;i+)/alert(sssi.tagName); /4.getElementsByClassName/var m = document.getElementsByClassName(xxx);/兼容firefox 不兼容ie5.節(jié)點(ie 與 火狐Firefox 的兼容性-ie6.0有些屬性不支持) 1.獲取根節(jié)點 var de = document.documentElement; /輸出html 2.獲取head與body var head = document.getElementsByTagName(head)0;/輸出head,body的獲取方式與得到head一樣的. 3.元素節(jié)點文檔中具有標(biāo)簽的節(jié)點1,文本節(jié)點標(biāo)簽中不是注釋的文本塊3 4.常用的節(jié)點屬性1.nodeType節(jié)點類型，元素節(jié)點是1，文本節(jié)點是3.2.nodeValue節(jié)點值，元素節(jié)點為空，文本節(jié)點的nodeValue屬性即為文本內(nèi)容.3.firstChild該元素節(jié)點包含的第一個子節(jié)點.4.lastChild該元素節(jié)點包含的最后一個子節(jié)點.5.nextSibling該節(jié)點的后一個兄弟節(jié)點.6.nodeName節(jié)點名稱，對于元素節(jié)點，返回tagName,對于文本，則返回#text function nextSibling(node) var n=node.nextSibling;if (n!=null & n.nodeType=3 & /s+$/.test(n.nodeValue) return n.nextSibling;return n;6.previousSibling該節(jié)點的前一個兄弟節(jié)點(火狐在打開firebug的時候，瀏覽器自動加一個div，關(guān)閉就可以了)7.childNodes子節(jié)點列表,可以通過node.childNodesindex（或node.childNodes.item(index)）來獲取子節(jié)點 事件(Event)6.一般事件 onclick鼠標(biāo)點擊時觸發(fā)此事件 ondblclick鼠標(biāo)雙擊時觸發(fā)此事件 onmousedown按下鼠標(biāo)時觸發(fā)此事件 onmouseup鼠標(biāo)按下后松開鼠標(biāo)時觸發(fā)此事件 onmouseover當(dāng)鼠標(biāo)移動到某對象范圍的上方時觸發(fā)此事件 onmousemove鼠標(biāo)移動時觸發(fā)此事件 onmouseout當(dāng)鼠標(biāo)離開某對象范圍時觸發(fā)此事件 onkeypress當(dāng)鍵盤上的某個鍵被按下并且釋放時觸發(fā)此事件. onkeydown當(dāng)鍵盤上某個按鍵被按下時觸發(fā)此事件 onkeyup當(dāng)鍵盤上某個按鍵被按放開時觸發(fā)此事件7.頁面相關(guān)事件 onabort圖片在下載時被用戶中斷 onbeforeunload當(dāng)前頁面的內(nèi)容將要被改變時觸發(fā)此事件 onerror出現(xiàn)錯誤時觸發(fā)此事件 onload頁面內(nèi)容完成時觸發(fā)此事件 onmove瀏覽器的窗口被移動時觸發(fā)此事件 onresize當(dāng)瀏覽器的窗口大小被改變時觸發(fā)此事件 onscroll瀏覽器的滾動條位置發(fā)生變化時觸發(fā)此事件 onstop瀏覽器的停止按鈕被按下時觸發(fā)此事件或者正在下載的文件被中斷 oncontextmenu當(dāng)彈出右鍵上下文菜單時發(fā)生 onunload當(dāng)前頁面將被改變時觸發(fā)此事件8.表單相關(guān)事件 onblur當(dāng)前元素失去焦點時觸發(fā)此事件 onchange當(dāng)前元素失去焦點并且元素的內(nèi)容發(fā)生改變而觸發(fā)此事件 onfocus當(dāng)某個元素獲得焦點時觸發(fā)此事件 onreset當(dāng)表單中RESET的屬性被激發(fā)時觸發(fā)此事件 onsubmit一個表單被遞交時觸發(fā)此事件 onselect當(dāng)元素被選擇時執(zhí)行9.解決每一個對象只能注冊一個事件的問題 1.需要將所有函數(shù)一次添加進去，但不能在運行時添加.obj.onclick = function () /不能重復(fù)進行函數(shù)互用.fn1();fn2();fn3(); 2.利用事件覆蓋原理，切換事件oDiv.onclick = toBig;function toBig()oDiv.className = big;oDiv.onclick = toSmall;function toSmall()oDiv.className = small;oDiv.onclick = toBig; 3.把this指針注冊給toBig對象oDiv.onclick = function()toBig.call(this);/把this指針注冊給toBig對象function toBig()this.className = big;this.onclick = toSmall;function toSmall()this.className = small;this.onclick = toBig; /4.getElementsByClassName/var m = document.getElementsByClassName(xxx);/兼容firefox 不兼容ie10 事件傳播冒泡與捕獲. 1.介紹：DOM事件標(biāo)準(zhǔn)定義了兩種事件流,這兩種事件流分別是捕獲和冒泡.Netscape選擇實現(xiàn)了捕獲事件流， 微軟則實現(xiàn)了冒泡事件流，W3C決定組合使用這兩種方法,并且大多數(shù)新瀏覽器都遵循這兩種事件流方式。 默認(rèn)情況下，事件使用冒泡事件流，不使用捕獲事件流。 2.冒泡事件流(從小到大的冒泡)1.在遵從W3C標(biāo)準(zhǔn)的瀏覽器里可以通過調(diào)用事件對象上事件對象.stopPropagation()方法或通過設(shè)置事件對象的事件對象.cancelBubble屬性為true，在Internet Explorer里可以通過設(shè)置事件對象的cancelBubble屬性為true，不支持stopPropagation()。如果不停止事件的傳播，事件將一直通過DOM冒泡直至到達文檔根. 3.捕獲事件流(大到小進行捕獲)事件的處理將從DOM層次的根開始，而不是從觸發(fā)事件的目標(biāo)元素開始，事件被從目標(biāo)元素的所有祖先元素依次往下傳遞。useCapture屬性為true. 默認(rèn)事件 ,-默認(rèn)執(zhí)行的事件. Ajax(Asynchronous JavaScript and XML 異步JavaScript和XML)DHTML-阿賈克斯1.介紹 1.描述從基于Web的應(yīng)用到基于數(shù)據(jù)的應(yīng)用的轉(zhuǎn)換。 2.Ajax的核心是JavaScript對象XmlHttpRequest(異步請求的技術(shù))。XmlHttpRequest使您可以使用JavaScript向服務(wù)器提出請求并處理響應(yīng)，而不阻塞用戶。 3.獨立于 Web 服務(wù)器軟件的瀏覽器技術(shù),用于創(chuàng)建更好更快以及交互性更強的 Web 應(yīng)用程序的技術(shù)。可以提高系統(tǒng)性能，優(yōu)化用戶界面2.主要包含的技術(shù) 基web標(biāo)準(zhǔn)（standards-based presentation）XHTML+CSS的表示； 使用 DOM（Document Object Model）進行動態(tài)顯示及交互 使用 XML 和 XSLT 進行數(shù)據(jù)交換及相關(guān)操作； 使用 XMLHttpRequest 進行異步數(shù)據(jù)查詢、檢索3.優(yōu)點和缺點 優(yōu)點 -更迅捷的響應(yīng)速度無頁面刷新,適合大量的數(shù)據(jù)例如：1.AJAX應(yīng)用可以僅向服務(wù)器發(fā)送并取回必需的數(shù)據(jù)，2.使用Ajax的最大優(yōu)點，就是能在不更新整個頁面的前提下維護數(shù)據(jù)3.Ajax不需要任何瀏覽器插件，但需要用戶允許JavaScript在瀏覽器上執(zhí)行。 缺點1.不能發(fā)送圖片只能傳送字符串.2.不能跨站,跨域名發(fā)信息.4.Ajax有兩種方式： 1.iframe 2.xmlhttp-XmlHttpRequest 5.get,post方式,同步異步區(qū)別 / readyState的取值如下：0-未初始化,1-正在裝載,2-裝載完畢,3-交互中,4-完成. 1.同步和異步的區(qū)別：1.同步適合少量數(shù)據(jù)，它是需要等待的,異步是適合大批量數(shù)據(jù)，它無需等待2.異步需要一個回調(diào)函數(shù).異步需要在open和send之間加一個：XmlHttp.setRequestHeader(Content-Type,application/x-www-form-urlencoded);/消息頭 2.get-send()不可以傳參,1.同步var url = AjaxServlet.do?timerId= + (new Date().getMilliseconds();/創(chuàng)建一個請求對象(協(xié)議)var xmlHttpReq = new ActiveXObject(MSXML2.XMLHTTP.3.0);/打開鏈接，創(chuàng)建一個新的http請求(并指定此請求的方法、url、驗證信息)xmlHttpReq.open(GET, url, false);xmlHttpReq.send();alert(getSyncRequest(); /執(zhí)行完后臺再輸出./將響應(yīng)信息作為字符串返回 Thread.sleep(3000); 3秒鐘后連續(xù)輸出.alert(xmlHttpReq.responseText); 2.異步-較同步的速度快./時間戳-緩存問題.var url = AjaxServlet.do?name=zhangsan&timerId=+ (new Date().getMilliseconds();/創(chuàng)建一個請求對象(協(xié)議)xmlHttpReq = new ActiveXObject(MSXML2.XMLHTTP.3.0);xmlHttpReq.onreadystatechange = HandleStateChange;/打開鏈接，創(chuàng)建一個新的http請求(并指定此請求的方法、url、驗證信息)xmlHttpReq.open(GET, url, true);xmlHttpReq.send(age=444);/Get方式不能用send傳參.alert(getNSyncRequest(); /先輸出,再等待響應(yīng)結(jié)果.function HandleStateChange() if (xmlHttpReq.readyState = 4) alert(HandleStateChange: + xmlHttpReq.responseText);/返回響應(yīng)結(jié)果 3.post-send()可以傳參,傳參需要頭文件信息.1.同步(open - false)var url = AjaxServlet.do?name=zhangsan&timerId=+ (new Date().getMilliseconds();/創(chuàng)建一個請求對象(協(xié)議)var xmlHttpReq = new ActiveXObject(MSXML2.XMLHTTP.3.0);/打開鏈接，創(chuàng)建一個新的http請求(并指定此請求的方法、url、驗證信息)xmlHttpReq.open(POST, url, false);xmlHttpReq.setRequestHeader(Content-Type,application/x-www-form-urlencoded); /頭文件xmlHttpReq.send(age=555&sss=ddd);alert(This postSyncRequest); /等后臺執(zhí)行完,再輸出alert(xmlHttpReq.responseText);2.異步(true)/時間戳var url = AjaxServlet.do?name=zhangsan&timerId=+ (new Date().getMilliseconds();/創(chuàng)建一個請求對象(協(xié)議)var xmlHttpReq = new ActiveXObject(MSXML2.XMLHTTP.3.0);xmlHttpReq.onreadystatechange = HandleStateChange;/打開鏈接，創(chuàng)建一個新的http請求(并指定此請求的方法、url、驗證信息)xmlHttpReq.open(POST, url, true);xmlHttpReq.setRequestHeader(Content-Type,application/x-www-form-urlencoded);xmlHttpReq.send(age=444); /post可以有send傳參.alert(This postNSyncRequest);/先輸出,再等待響應(yīng)結(jié)果function H