JavaScript面試總結(jié).docx

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