摘要：方法接受一個(gè)布爾值參數(shù)，表示是否執(zhí)行深復(fù)制方法不會(huì)復(fù)制添加到節(jié)點(diǎn)中的屬性，例如事件處理程序等。由于跨域安全限制，來(lái)自不同子域的頁(yè)面無(wú)法通過(guò)通信。這三個(gè)集合都是動(dòng)態(tài)的換句話說(shuō)，每當(dāng)文檔結(jié)構(gòu)發(fā)生變化時(shí)，它們都會(huì)得到更新。
第十章 DOM
1001、每一段標(biāo)記都可以通過(guò)樹(shù)中的一個(gè)節(jié)點(diǎn)來(lái)表示：HTML 元素通過(guò)元素節(jié)點(diǎn)表示，特性（attribute）通過(guò)特性節(jié)點(diǎn)表示，文檔類(lèi)型通過(guò)文檔類(lèi)型節(jié)點(diǎn)表示，而注釋則通過(guò)注釋節(jié)點(diǎn)表示?？偣灿?12 種節(jié)點(diǎn)類(lèi)型，這些類(lèi)型都繼承自一個(gè)基類(lèi)型
1002、JavaScript 中的所有節(jié)點(diǎn)類(lèi)型都繼承自 Node 類(lèi)型，因此所有節(jié)點(diǎn)類(lèi)型都共享著相同的基本屬性和方法
1003、所有節(jié)點(diǎn)都有的最后一個(gè)屬性是 ownerDocument ，該屬性指向表示整個(gè)文檔的文檔節(jié)點(diǎn)。這種關(guān)系表示的是任何節(jié)點(diǎn)都屬于它所在的文檔，任何節(jié)點(diǎn)都不能同時(shí)存在于兩個(gè)或更多個(gè)文檔中。通過(guò)這個(gè)屬性，我們可以不必在節(jié)點(diǎn)層次中通過(guò)層層回溯到達(dá)頂端，而是可以直接訪問(wèn)文檔節(jié)點(diǎn)
1004、如果需要把節(jié)點(diǎn)放在 childNodes 列表中某個(gè)特定的位置上，而不是放在末尾，那么可以使用insertBefore() 方法。這個(gè)方法接受兩個(gè)參數(shù)：要插入的節(jié)點(diǎn)和作為參照的節(jié)點(diǎn)。插入節(jié)點(diǎn)后，被插入的節(jié)點(diǎn)會(huì)變成參照節(jié)點(diǎn)的前一個(gè)同胞節(jié)點(diǎn)（ previousSibling ），同時(shí)被方法返回。如果參照節(jié)點(diǎn)是null ，則 insertBefore() 與 appendChild() 執(zhí)行相同的操作
1005、 replaceChild() 方法接受的兩個(gè)參數(shù)是：要插入的節(jié)點(diǎn)和要替換的節(jié)點(diǎn)。要替換的節(jié)點(diǎn)將由這個(gè)方法返回并從文檔樹(shù)中被移除，同時(shí)由要插入的節(jié)點(diǎn)占據(jù)其位置
1006、如果只想移除而非替換節(jié)點(diǎn)，可以使用 removeChild() 方法。這個(gè)方法接受一個(gè)參數(shù)，即要移除的節(jié)點(diǎn)。被移除的節(jié)點(diǎn)將成為方法的返回值
1007、要使用這幾個(gè)方法必須先取得父節(jié)點(diǎn)（使用 parentNode 屬性）。另外，并不是所有類(lèi)型的節(jié)點(diǎn)都有子節(jié)點(diǎn)，如果在不支持子節(jié)點(diǎn)的節(jié)點(diǎn)上調(diào)用了這些方法，將會(huì)導(dǎo)致錯(cuò)誤發(fā)生
1008、 cloneNode() ，用于創(chuàng)建調(diào)用這個(gè)方法的節(jié)點(diǎn)的一個(gè)完全相同的副本。 cloneNode() 方法接受一個(gè)布爾值參數(shù)，表示是否執(zhí)行深復(fù)制
1009、cloneNode() 方法不會(huì)復(fù)制添加到 DOM 節(jié)點(diǎn)中的 JavaScript 屬性，例如事件處理程序等。這個(gè)方法只復(fù)制特性、（在明確指定的情況下也復(fù)制）子節(jié)點(diǎn)，其他一切都不會(huì)復(fù)制。IE 在此存在一個(gè) bug，即它會(huì)復(fù)制事件處理程序，所以我們建議在復(fù)制之前最好先移除事件處理程序
1010、最后一個(gè)方法是 normalize() ，這個(gè)方法唯一的作用就是處理文檔樹(shù)中的文本節(jié)點(diǎn)。由于解析器的實(shí)現(xiàn)或 DOM 操作等原因，可能會(huì)出現(xiàn)文本節(jié)點(diǎn)不包含文本，或者接連出現(xiàn)兩個(gè)文本節(jié)點(diǎn)的情況。當(dāng)在某個(gè)節(jié)點(diǎn)上調(diào)用這個(gè)方法時(shí)，就會(huì)在該節(jié)點(diǎn)的后代節(jié)點(diǎn)中查找上述兩種情況。如果找到了空文本節(jié)點(diǎn)，則刪除它；如果找到相鄰的文本節(jié)點(diǎn)，則將它們合并為一個(gè)文本節(jié)點(diǎn)
1011、雖然 DOM 標(biāo)準(zhǔn)規(guī)定 Document 節(jié)點(diǎn)的子節(jié)點(diǎn)可以是 DocumentType 、 Element 、 ProcessingIn-struction 或 Comment ，但還有兩個(gè)內(nèi)置的訪問(wèn)其子節(jié)點(diǎn)的快捷方式。第一個(gè)就是 documentElement屬性，該屬性始終指向 HTML 頁(yè)面中的 元素。另一個(gè)就是通過(guò) childNodes 列表訪問(wèn)文檔元素，但通過(guò) documentElement 屬性則能更快捷、更直接地訪問(wèn)該元素
1012、所有瀏覽器都支持 document.documentElement 和 document.body 屬性
1013、作為 HTMLDocument 的一個(gè)實(shí)例， document 對(duì)象還有一些標(biāo)準(zhǔn)的 Document 對(duì)象所沒(méi)有的屬性。這些屬性提供了 document 對(duì)象所表現(xiàn)的網(wǎng)頁(yè)的一些信息。其中第一個(gè)屬性就是 title ，包含著
元素中的文本——顯示在瀏覽器窗口的標(biāo)題欄或標(biāo)簽頁(yè)上。通過(guò)這個(gè)屬性可以取得當(dāng)前頁(yè)面的標(biāo)題，也可以修改當(dāng)前頁(yè)面的標(biāo)題并反映在瀏覽器的標(biāo)題欄中。修改 title 屬性的值不會(huì)改變 <title>元素</p>
<p>1014、 URL 屬性中包含頁(yè)面完整的 URL（即地址欄中顯示的 URL）， domain 屬性中只包含頁(yè)面的域名，而 referrer屬性中則保存著鏈接到當(dāng)前頁(yè)面的那個(gè)頁(yè)面的 URL。在沒(méi)有來(lái)源頁(yè)面的情況下， referrer 屬性中可能會(huì)包含空字符串。所有這些信息都存在于請(qǐng)求的 HTTP 頭部，只不過(guò)是通過(guò)這些屬性讓我們能夠在JavaScrip 中訪問(wèn)它們而已</p>
<p>1015、當(dāng)頁(yè)面中包含來(lái)自其他子域的框架或內(nèi)嵌框架時(shí)，能夠設(shè)置 document.domain 就非常方便了。由于 跨 域 安 全 限 制 ， 來(lái) 自 不 同 子 域 的 頁(yè) 面 無(wú) 法 通 過(guò) JavaScript 通 信 。 而 通 過(guò) 將 每 個(gè) 頁(yè) 面 的document.domain 設(shè)置為相同的值，這些頁(yè)面就可以互相訪問(wèn)對(duì)方包含的 JavaScript 對(duì)象了</p>
<p>1016、假設(shè)有一個(gè)頁(yè)面加載自 www.wrox.com，其中包含一個(gè)內(nèi)嵌框架，框架內(nèi)的頁(yè)面加載自 p2p.wrox.com。由于 document.domain 字符串不一樣，內(nèi)外兩個(gè)頁(yè)面之間無(wú)法相互訪問(wèn)對(duì)方的 JavaScript 對(duì)象。但如果將這兩個(gè)頁(yè)面的 document.domain 值都設(shè)置為 "wrox.com" ，它們之間就可以通信了。瀏覽器對(duì) domain 屬性還有一個(gè)限制，即如果域名一開(kāi)始是“松散的”（loose），那么不能將它再設(shè)置為“緊繃的”（tight）。換句話說(shuō)，在將 document.domain 設(shè)置為 "wrox.com" 之后，就不能再將其設(shè)置回 "p2p.wrox.com" ，否則將會(huì)導(dǎo)致錯(cuò)誤</p>
<p>1017、HTMLCollection 對(duì)象還有一個(gè)方法，叫做 namedItem() ，使用這個(gè)方法可以通過(guò)元素的 name特性取得集合中的項(xiàng)。對(duì) HTMLCollection 而言，我們可以向方括號(hào)中傳入數(shù)值或字符串形式的索引值。在后臺(tái)，對(duì)數(shù)值索引就會(huì)調(diào)用 item() ，而對(duì)字符串索引就會(huì)調(diào)用 namedItem()</p>
<p>1018、有一個(gè) document 對(duì)象的功能已經(jīng)存在很多年了，那就是將輸出流寫(xiě)入到網(wǎng)頁(yè)中的能力。這個(gè)能力體現(xiàn)在下列 4 個(gè)方法中： write() 、 writeln() 、 open() 和 close() 。其中， write() 和 writeln()方法都接受一個(gè)字符串參數(shù)，即要寫(xiě)入到輸出流中的文本。 write() 會(huì)原樣寫(xiě)入，而 writeln() 則會(huì)在字符串的末尾添加一個(gè)換行符（ n ）。在頁(yè)面被加載的過(guò)程中，可以使用這兩個(gè)方法向頁(yè)面中動(dòng)態(tài)地加入內(nèi)容</p>
<p>1019、方法 open() 和 close() 分別用于打開(kāi)和關(guān)閉網(wǎng)頁(yè)的輸出流</p>
<p>1020、每個(gè)元素都有一或多個(gè)特性，這些特性的用途是給出相應(yīng)元素或其內(nèi)容的附加信息。操作特性的DOM 方法主要有三個(gè)，分別是 getAttribute() 、 setAttribute() 和 removeAttribute()</p>
<p>1021、與 getAttribute() 對(duì)應(yīng)的方法是 setAttribute() ，這個(gè)方法接受兩個(gè)參數(shù)：要設(shè)置的特性名和值。如果特性已經(jīng)存在， setAttribute() 會(huì)以指定的值替換現(xiàn)有的值；如果特性不存在， setAttribute()則創(chuàng)建該屬性并設(shè)置相應(yīng)的值</p>
<p>1022、 removeAttribute() ，這個(gè)方法用于徹底刪除元素的特性。調(diào)用這個(gè)方法不僅會(huì)清除特性的值，而且也會(huì)從元素中完全刪除特性</p>
<p>1023、使用 document.createElement() 方法可以創(chuàng)建新元素。這個(gè)方法只接受一個(gè)參數(shù)，即要?jiǎng)?chuàng)建元素的標(biāo)簽名。這個(gè)標(biāo)簽名在 HTML 文檔中不區(qū)分大小寫(xiě)，而在 XML（包括 XHTML）文檔中，則是區(qū)分大小寫(xiě)的</p>
<p>1024、文本節(jié)點(diǎn)由 Text 類(lèi)型表示，包含的是可以照字面解釋的純文本內(nèi)容。純文本中可以包含轉(zhuǎn)義后的HTML 字符，但不能包含 HTML 代碼</p>
<p>1025、可以使用 document.createTextNode() 創(chuàng)建新文本節(jié)點(diǎn)，這個(gè)方法接受一個(gè)參數(shù)——要插入節(jié)點(diǎn)中的文本</p>
<p>1026、使用 document.createComment() 并為其傳遞注釋文本也可以創(chuàng)建注釋節(jié)點(diǎn)</p>
<p>1027、雖然不能把文檔片段直接添加到文檔中，但可以將它作為一個(gè)“倉(cāng)庫(kù)”來(lái)使用，即可以在里面保存將來(lái)可能會(huì)添加到文檔中的節(jié)點(diǎn)。要?jiǎng)?chuàng)建文檔片段，可以使用 document.createDocumentFragment() 方法</p>
<p>1028、文檔片段繼承了 Node 的所有方法，通常用于執(zhí)行那些針對(duì)文檔的 DOM操作。如果將文檔中的節(jié)點(diǎn)添加到文檔片段中，就會(huì)從文檔樹(shù)中移除該節(jié)點(diǎn)，也不會(huì)從瀏覽器中再看到該節(jié)點(diǎn)。添加到文檔片段中的新節(jié)點(diǎn)同樣也不屬于文檔樹(shù)?？梢酝ㄟ^(guò) appendChild() 或insertBefore() 將文檔片段中內(nèi)容添加到文檔中。在將文檔片段作為參數(shù)傳遞給這兩個(gè)方法時(shí)，實(shí)際上只會(huì)將文檔片段的所有子節(jié)點(diǎn)添加到相應(yīng)位置上；文檔片段本身永遠(yuǎn)不會(huì)成為文檔樹(shù)的一部分</p>
<p>1029、Attr 對(duì)象有 3 個(gè)屬性： name 、 value 和 specified 。其中， name 是特性名稱(chēng)（與 nodeName 的值相同）， value 是特性的值（與 nodeValue 的值相同），而 specified 是一個(gè)布爾值，用以區(qū)別特性是在代碼中指定的，還是默認(rèn)的</p>
<p>1030、理解 NodeList 及其“近親” NamedNodeMap 和 HTMLCollection ，是從整體上透徹理解 DOM 的關(guān)鍵所在。這三個(gè)集合都是“動(dòng)態(tài)的”；換句話說(shuō)，每當(dāng)文檔結(jié)構(gòu)發(fā)生變化時(shí)，它們都會(huì)得到更新。因此，它們始終都會(huì)保存著最新、最準(zhǔn)確的信息。從本質(zhì)上說(shuō)，所有 NodeList 對(duì)象都是在訪問(wèn) DOM文檔時(shí)實(shí)時(shí)運(yùn)行的查詢</p>
<p>1031、一般來(lái)說(shuō)，應(yīng)該盡量減少訪問(wèn) NodeList 的次數(shù)。因?yàn)槊看卧L問(wèn) NodeList ，都會(huì)運(yùn)行一次基于文檔的查詢。所以，可以考慮將從 NodeList 中取得的值緩存起來(lái)</p>
<p>1032、querySelector() 方法接收一個(gè) CSS 選擇符，返回與該模式匹配的第一個(gè)元素，如果沒(méi)有找到匹配的元素，返回 null 。</p>
<p>1033、querySelectorAll() 方法接收的參數(shù)與 querySelector() 方法一樣，都是一個(gè) CSS 選擇符，但返回的是所有匹配的元素而不僅僅是一個(gè)元素。這個(gè)方法返回的是一個(gè) NodeList 的實(shí)例</p>
<p>1034、如果傳入了瀏覽器不支持的選擇符或者選擇符中有語(yǔ)法錯(cuò)誤，querySelectorAll() 會(huì)拋出錯(cuò)誤</p>
<p>1035、Selectors API Level 2 規(guī)范為 Element 類(lèi)型新增了一個(gè)方法 matchesSelector() 。這個(gè)方法接收一個(gè)參數(shù)，即 CSS 選擇符，如果調(diào)用元素與該選擇符匹配，返回 true ；否則，返回 false</p>
<p>1036、對(duì)于元素間的空格，IE9及之前版本不會(huì)返回文本節(jié)點(diǎn)，而其他所有瀏覽器都會(huì)返回文本節(jié)點(diǎn)</p>
<p>1037、支持 getElementsByClassName() 方法的瀏覽器有 IE 9+、Firefox 3+、Safari 3.1+、Chrome 和Opera 9.5+</p>
<p>1038、新增了 document.hasFocus() 方法，這個(gè)方法用于確定文檔是否獲得了焦點(diǎn)</p>
<p>1039、使用 document.readyState 的最恰當(dāng)方式，就是通過(guò)它來(lái)實(shí)現(xiàn)一個(gè)指示文檔已經(jīng)加載完成的指示器。支持 readyState 屬性的瀏覽器有 IE4+、Firefox 3.6+、Safari、Chrome和 Opera 9+</p>
<p>1040、自從 IE6 開(kāi)始區(qū)分渲染頁(yè)面的模式是標(biāo)準(zhǔn)的還是混雜的，檢測(cè)頁(yè)面的兼容模式就成為瀏覽器的必要功能。IE 為此給 document 添加了一個(gè)名為 compatMode 的屬性，這個(gè)屬性就是為了告訴開(kāi)發(fā)人員瀏覽器采用了哪種渲染模式。就像下面例子中所展示的那樣，在標(biāo)準(zhǔn)模式下， document.compatMode 的值等于 "CSS1Compat" ，而在混雜模式下， document.compatMode 的值等于 "BackCompat"。</p>
<p>1041、HTML5規(guī)定可以為元素添加非標(biāo)準(zhǔn)的屬性，但要添加前綴 data- ，目的是為元素提供與渲染無(wú)關(guān)的信息，或者提供語(yǔ)義信息。這些屬性可以任意添加、隨便命名，只要以 data- 開(kāi)頭即可</p>
<p>1042、在讀模式下， innerHTML 屬性返回與調(diào)用元素的所有子節(jié)點(diǎn)（包括元素、注釋和文本節(jié)點(diǎn)）對(duì)應(yīng)的 HTML 標(biāo)記。在寫(xiě)模式下， innerHTML 會(huì)根據(jù)指定的值創(chuàng)建新的 DOM樹(shù)，然后用這個(gè) DOM 樹(shù)完全替換調(diào)用元素原先的所有子節(jié)點(diǎn)</p>
<p>1043、在寫(xiě)模式下， innerHTML 的值會(huì)被解析為 DOM 子樹(shù)，替換調(diào)用元素原來(lái)的所有子節(jié)點(diǎn)。因?yàn)樗闹当徽J(rèn)為是 HTML，所以其中的所有標(biāo)簽都會(huì)按照瀏覽器處理 HTML 的標(biāo)準(zhǔn)方式轉(zhuǎn)換為元素（同樣，這里的轉(zhuǎn)換結(jié)果也因?yàn)g覽器而異）。如果設(shè)置的值僅是文本而沒(méi)有 HTML 標(biāo)簽，那么結(jié)果就是設(shè)置純文本</p>
<p>1044、 innerHTML 字符串一開(kāi)始（而且整個(gè)）就是一個(gè)“無(wú)作用域的元素”，所以這個(gè)字符串會(huì)變成空字符串</p>
<p>1045、不支持 innerHTML 的元素有：<b> <col> 、 <colgroup> 、<frameset> 、 <head> 、 <html> 、 <style> 、 <table> 、<tbody> 、<thead> 、<tfoot> 和 <tr></b> 。此外，在 IE8 及更早版本中， <title> 元素也沒(méi)有 innerHTML 屬性</p>
<p>1046、在讀模式下， outerHTML 返回調(diào)用它的元素及所有子節(jié)點(diǎn)的 HTML 標(biāo)簽。在寫(xiě)模式下， outerHTML會(huì)根據(jù)指定的 HTML 字符串創(chuàng)建新的 DOM子樹(shù)，然后用這個(gè) DOM 子樹(shù)完全替換調(diào)用元素。</p>
<p>1047、由于 IE9 之前的版本與其他瀏覽器在處理文本節(jié)點(diǎn)中的空白符時(shí)有差異，因此就出現(xiàn)了 children屬性。這個(gè)屬性是 HTMLCollection 的實(shí)例，只包含元素中同樣還是元素的子節(jié)點(diǎn)。除此之外，children 屬性與 childNodes 沒(méi)有什么區(qū)別，即在元素只包含元素子節(jié)點(diǎn)時(shí)，這兩個(gè)屬性的值相同</p>
<p>1048、在實(shí)際開(kāi)發(fā)中，經(jīng)常需要知道某個(gè)節(jié)點(diǎn)是不是另一個(gè)節(jié)點(diǎn)的后代。調(diào)用 contains() 方法的應(yīng)該是祖先節(jié)點(diǎn)，也就是搜索開(kāi)始的節(jié)點(diǎn)，這個(gè)方法接收一個(gè)參數(shù)，即要檢測(cè)的后代節(jié)點(diǎn)。如果被檢測(cè)的節(jié)點(diǎn)是后代節(jié)點(diǎn)，該方法返回 true ；否則，返回 false 。</p>
<p>1049、innerText 與 textContent 返回的內(nèi)容并不完全一樣。比如，innerText 會(huì)忽略行內(nèi)的樣式和腳本，而 textContent 則會(huì)像返回其他文本一樣返回行內(nèi)的樣式和腳本代碼。避免跨瀏覽器兼容問(wèn)題的最佳途徑，就是從不包含行內(nèi)樣式或行內(nèi)腳本的 DOM 子樹(shù)副本或 DOM 片段中讀取文本</p>
<p>1050、scrollIntoViewIfNeeded(alignCenter) ：只在當(dāng)前元素在視口中不可見(jiàn)的情況下，才滾動(dòng)瀏覽器窗口或容器元素，最終讓它可見(jiàn)。如果當(dāng)前元素在視口中可見(jiàn)，這個(gè)方法什么也不做。如果將可選的 alignCenter 參數(shù)設(shè)置為 true ，則表示盡量將元素顯示在視口中部（垂直方向）。Safari 和 Chrome 實(shí)現(xiàn)了這個(gè)方法</p>
<p>1051、在標(biāo)準(zhǔn)模式下，所有度量值都必須指定一個(gè)度量單位。在混雜模式下，可以將style.width 設(shè)置為 "20" ，瀏覽器會(huì)假設(shè)它是 "20px" ；但在標(biāo)準(zhǔn)模式下，將style.width 設(shè)置為 "20" 會(huì)導(dǎo)致被忽略——因?yàn)闆](méi)有度量單位。在實(shí)踐中，最好始終都指定度量單位</p>
<p>1052、通過(guò) cssText 屬性可以訪問(wèn)style特性中的CSS代碼。在讀取模式下， cssText 返回瀏覽器對(duì) style特性中 CSS 代碼的內(nèi)部表示。在寫(xiě)入模式下，賦給 cssText 的值會(huì)重寫(xiě)整個(gè) style 特性的值；也就是說(shuō)，以前通過(guò) style 特性指定的樣式信息都將丟失</p>
<p>1053、如果你需要更多信息，可以使用 getPropertyCSSValue() 方法，它返回一個(gè)包含兩個(gè)屬性的 CSSValue 對(duì)象，這兩個(gè)屬性分別是： cssText 和 cssValueType 。其中， cssText 屬性的值與 getPropertyValue() 返回的值相同，而 cssValueType 屬性則是一個(gè)數(shù)值常量，表示值的類(lèi)型：0 表示繼承的值，1 表示基本的值，2 表示值列表，3 表示自定義的值</p>
<p>1054、要從元素的樣式中移除某個(gè) CSS 屬性，需要使用 removeProperty() 方法。使用這個(gè)方法移除一個(gè)屬性，意味著將會(huì)為該屬性應(yīng)用默認(rèn)的樣式（從其他樣式表經(jīng)層疊而來(lái)）。例如，要移除通過(guò) style特性設(shè)置的 border 屬性</p>
<p>1055、 getComputedStyle() 方法返回一個(gè) CSSStyleDeclaration 對(duì)象（與 style 屬性的類(lèi)型相同），其中包含當(dāng)前元素的所有計(jì)算的樣式。IE 不支持 getComputedStyle() 方法，但它有一種類(lèi)似的概念。在 IE 中，每個(gè)具有 style 屬性的元素還有一個(gè) currentStyle 屬性。這個(gè)屬性是 CSSStyleDeclaration 的實(shí)例，包含當(dāng)前元素全部計(jì)算后的樣式</p>
<p>1056、無(wú)論在哪個(gè)瀏覽器中，最重要的一條是要記住所有計(jì)算的樣式都是只讀的；不能修改計(jì)算后樣式對(duì)象中的 CSS 屬性。此外，計(jì)算后的樣式也包含屬于瀏覽器內(nèi)部樣式表的樣式信息，因此任何具有默認(rèn)值的 CSS 屬性都會(huì)表現(xiàn)在計(jì)算后的樣式中。例如，所有瀏覽器中的 visibility 屬性都有一個(gè)默認(rèn)值，但這個(gè)值會(huì)因?qū)崿F(xiàn)而異</p>
<p>1057、CSSStyleSheet 類(lèi)型表示的是樣式表，包括通過(guò) <b><link></b> 元素包含的樣式表和在 <b><style></b> 元素中定義的樣式表</p>
<p>1058、從樣式表中刪除規(guī)則的方法是 deleteRule() ，這個(gè)方法接受一個(gè)參數(shù)：要?jiǎng)h除的規(guī)則的位置</p>
<p>1059、首先要介紹的屬性涉及偏移量（offset dimension），包括元素在屏幕上占用的所有可見(jiàn)的空間。元素的可見(jiàn)大小由其高度、寬度決定，包括所有內(nèi)邊距、滾動(dòng)條和邊框大小（注意，不包括外邊距）</p>
<p>1060、所有這些偏移量屬性都是只讀的，而且每次訪問(wèn)它們都需要重新計(jì)算。因此，應(yīng)該盡量避免重復(fù)訪問(wèn)這些屬性；如果需要重復(fù)使用其中某些屬性的值，可以將它們保存在局部變量中，以提高性能。</p>
<b>第十一章 DOM擴(kuò)展、第十二章 DOM2和DOM3</b>
<p>1101、querySelector() 方法接收一個(gè) CSS 選擇符，返回與該模式匹配的第一個(gè)元素，如果沒(méi)有找到匹配的元素，返回 null</p>
<p>1102、querySelectorAll() 方法接收的參數(shù)與 querySelector() 方法一樣，都是一個(gè) CSS 選擇符，但返回的是所有匹配的元素而不僅僅是一個(gè)元素。這個(gè)方法返回的是一個(gè) NodeList 的實(shí)例。返回的值實(shí)際上是帶有所有屬性和方法的 NodeList ，而其底層實(shí)現(xiàn)則類(lèi)似于一組元素的快照，而非不斷對(duì)文檔進(jìn)行搜索的動(dòng)態(tài)查詢</p>
<p>1103、childElementCount ：返回子元素（不包括文本節(jié)點(diǎn)和注釋?zhuān)┑膫€(gè)數(shù)；firstElementChild ：指向第一個(gè)子元素； firstChild 的元素版；lastElementChild ：指向最后一個(gè)子元素； lastChild 的元素版； previousElementSibling ：指向前一個(gè)同輩元素； previousSibling 的元素版；nextElementSibling ：指向后一個(gè)同輩元素； nextSibling 的元素版</p>
<p>1104、getElementsByClassName() 方法接收一個(gè)參數(shù)，即一個(gè)包含一或多個(gè)類(lèi)名的字符串，返回帶有指定類(lèi)的所有元素的 NodeList。傳入多個(gè)類(lèi)名時(shí)，類(lèi)名的先后順序不重要。因?yàn)榉祷氐膶?duì)象是 NodeList ，所以使用這個(gè)方法與使用 getElementsByTagName()。以及其他返回 NodeList 的 DOM 方法都具有同樣的性能問(wèn)題。支持 getElementsByClassName() 方法的瀏覽器有 IE 9+、Firefox 3+、Safari 3.1+、Chrome 和Opera 9.5+</p>
<p>1105、div.classList.remove("user") => add(value) ：將給定的字符串值添加到列表中。如果值已經(jīng)存在，就不添加了；contains(value) ：表示列表中是否存在給定的值，如果存在則返回 true ，否則返回 false；remove(value) ：從列表中刪除給定的字符串；toggle(value) ：如果列表中已經(jīng)存在給定的值，刪除它；如果列表中沒(méi)有給定的值，添加它。支持 classList 屬性的瀏覽器有 Firefox 3.6+和 Chrome</p>
<p>1106、 document.activeElement 屬性，這個(gè)屬性始終會(huì)引用 DOM 中當(dāng)前獲得了焦點(diǎn)的元素。默認(rèn)情況下，文檔剛剛加載完成時(shí)， document.activeElement 中保存的是 document.body 元素的引用。文檔加載期間， document.activeElement 的值為 null</p>
<p>1107、 document.hasFocus() 方法，這個(gè)方法用于確定文檔是否獲得了焦點(diǎn)。</p>
<p>1108、實(shí)現(xiàn)了這兩個(gè)屬性的瀏覽器的包括 IE 4+、Firefox 3+、Safari 4+、Chrome 和 Opera 8+</p>
<p>1109、使用 document.readyState 的最恰當(dāng)方式，就是通過(guò)它來(lái)實(shí)現(xiàn)一個(gè)指示文檔已經(jīng)加載完成的指示器</p>
<p>1110、在標(biāo)準(zhǔn)模式下， document.compatMode 的值等于 "CSS1Compat" ，而在混雜模式下， document.compatMode 的值等于 "BackCompat"</p>
<p>1111、HTML5 新增了 document.head 屬性，引用文檔的 <head> 元素。實(shí)現(xiàn) document.head 屬性的瀏覽器包括 Chrome 和 Safari 5</p>
<p>1112、HTML5規(guī)定可以為元素添加非標(biāo)準(zhǔn)的屬性，但要添加前綴 data- ，目的是為元素提供與渲染無(wú)關(guān)的信息，或者提供語(yǔ)義信息。這些屬性可以任意添加、隨便命名，只要以 data- 開(kāi)頭即可</p>
<p>1113、添加了自定義屬性之后，可以通過(guò)元素的 dataset 屬性來(lái)訪問(wèn)自定義屬性的值。 dataset 屬性的值是 DOMStringMap 的一個(gè)實(shí)例，也就是一個(gè)名值對(duì)兒的映射。在這個(gè)映射中，每個(gè) data-name 形式的屬性都會(huì)有一個(gè)對(duì)應(yīng)的屬性，只不過(guò)屬性名沒(méi)有 data- 前綴（比如，自定義屬性是 data-myname ，那映射中對(duì)應(yīng)的屬性就是 myname ）</p>
<p>1114、在讀模式下， innerHTML 屬性返回與調(diào)用元素的所有子節(jié)點(diǎn)（包括元素、注釋和文本節(jié)點(diǎn)）對(duì)應(yīng)的 HTML 標(biāo)記。在寫(xiě)模式下， innerHTML 會(huì)根據(jù)指定的值創(chuàng)建新的 DOM樹(shù)，然后用這個(gè) DOM 樹(shù)完全替換調(diào)用元素原先的所有子節(jié)點(diǎn)</p>
<p>1115、使用 innerHTML 屬性也有一些限制。比如，在大多數(shù)瀏覽器中，通過(guò) innerHTML 插入 <b>"</b>
</p>
<p>1116、并不是所有元素都支持 innerHTML 屬性。不支持 innerHTML 的元素有： <b><col> 、 <colgroup> 、<frameset> 、 <head> 、 <html> 、 <style> 、 <table> 、 <tbody> 、 <thead> 、 <tfoot> 和 <tr></b> 。此外，在 IE8 及更早版本中， <title> 元素也沒(méi)有 innerHTML 屬性</p>
<p>1117、IE8 為此提供了 window.toStaticHTML() 方法，這個(gè)方法接收一個(gè)參數(shù)，即一個(gè) HTML 字符串；返回一個(gè)經(jīng)過(guò)無(wú)害處理后的版本——從源 HTML 中刪除所有腳本節(jié)點(diǎn)和事件處理程序?qū)傩?/p>
<p>1118、如果在<div>元素上調(diào)用outerHTML，會(huì)返回與上面相同的代碼，包括<div>本身。支持outerHTML屬性的瀏覽器有IE4+、Safari 4+、Chrome和Opera 8+。Firefox 7及之前版本都不支持outerHTML屬性</p>
<p>1119、插入標(biāo)記的最后一個(gè)新增方式是 insertAdjacentHTML() 方法。這個(gè)方法最早也是在IE中出現(xiàn)的，它接收兩個(gè)參數(shù)：插入位置和要插入的 HTML 文本。"beforebegin" ，在當(dāng)前元素之前插入一個(gè)緊鄰的同輩元素；"afterbegin" ，在當(dāng)前元素之下插入一個(gè)新的子元素或在第一個(gè)子元素之前再插入新的子元素；"beforeend" ，在當(dāng)前元素之下插入一個(gè)新的子元素或在最后一個(gè)子元素之后再插入新的子元素；"afterend" ，在當(dāng)前元素之后插入一個(gè)緊鄰的同輩元素。第二個(gè)參數(shù)是一個(gè) HTML 字符串（與 innerHTML 和 outerHTML的值相同）。支持insertAdjacentHTML() 方法的瀏覽器有 IE、Firefox 8+、Safari、Opera 和 Chrome</p>
<p>1120、scrollIntoView() 可以在所有 HTML 元素上調(diào)用，通過(guò)滾動(dòng)瀏覽器窗口或某個(gè)容器元素，調(diào)用元素就可以出現(xiàn)在視口中。如果給這個(gè)方法傳入 true 作為參數(shù)，或者不傳入任何參數(shù)，那么窗口滾動(dòng)之后會(huì)讓調(diào)用元素的頂部與視口頂部盡可能平齊。如果傳入 false 作為參數(shù)，調(diào)用元素會(huì)盡可能全部出現(xiàn)在視口中，（可能的話，調(diào)用元素的底部會(huì)與視口頂部平齊）。支持 scrollIntoView() 方法的瀏覽器有 IE、Firefox、Safari 和 Opera</p>
<p>1121、children這個(gè)屬性是 HTMLCollection 的實(shí)例，只包含元素中同樣還是元素的子節(jié)點(diǎn)。除此之外，children 屬性與 childNodes 沒(méi)有什么區(qū)別，即在元素只包含元素子節(jié)點(diǎn)時(shí)，這兩個(gè)屬性的值相同。支持 children 屬性的瀏覽器有 IE5、Firefox 3.5、Safari 2（但有 bug）、Safari 3（完全支持）、Opera8和 Chrome（所有版本）。IE8 及更早版本的 children 屬性中也會(huì)包含注釋節(jié)點(diǎn)，但 IE9 之后的版本則只返回元素節(jié)點(diǎn)</p>
<p>1122、調(diào)用 contains() 方法的應(yīng)該是祖先節(jié)點(diǎn)，也就是搜索開(kāi)始的節(jié)點(diǎn)，這個(gè)方法接收一個(gè)參數(shù)，即要檢測(cè)的后代節(jié)點(diǎn)。如果被檢測(cè)的節(jié)點(diǎn)是后代節(jié)點(diǎn)，該方法返回 true ；否則，返回 false。支持 contains() 方法的瀏覽器有 IE、Firefox 9+、Safari、Opera 和 Chrome</p>
<p>1123、多數(shù)情況下，都可以通過(guò)簡(jiǎn)單地轉(zhuǎn)換屬性名的格式來(lái)實(shí)現(xiàn)轉(zhuǎn)換。其中一個(gè)不能直接轉(zhuǎn)換的 CSS 屬性就是 float 。由于 float 是 JavaScript 中的保留字，因此不能用作屬性名。“DOM2 級(jí)樣式”規(guī)范規(guī)定樣式對(duì)象上相應(yīng)的屬性名應(yīng)該是 cssFloat ；Firefox、Safari、Opera 和 Chrome 都支持這個(gè)屬性，而 IE支持的則是 styleFloat</p>
<p>1124、通過(guò) cssText 屬性可以訪問(wèn)style特性中的CSS代碼。在讀取模式下， cssText 返回瀏覽器對(duì) style特性中 CSS 代碼的內(nèi)部表示。在寫(xiě)入模式下，賦給 cssText 的值會(huì)重寫(xiě)整個(gè) style 特性的值；也就是說(shuō)，以前通過(guò) style 特性指定的樣式信息都將丟失</p>
<p>1125、getPropertyValue() 方法取得的始終都是 CSS 屬性值的字符串表示。如果你需要更多信息，可以使用 getPropertyCSSValue() 方法，它返回一個(gè)包含兩個(gè)屬性的 CSSValue 對(duì)象，這兩個(gè)屬性分別是： cssText 和 cssValueType 。其中， cssText 屬性的值與getPropertyValue() 返回的值相同，而 cssValueType 屬性則是一個(gè)數(shù)值常量，表示值的類(lèi)型：0 表示繼承的值，1 表示基本的值，2 表示值列表，3 表示自定義的值。在實(shí)際開(kāi)發(fā)中， getPropertyCSSValue() 使用得比 getPropertyValue() 少得多。IE9+、Safarie3+以及 Chrome 支持這個(gè)方法。Firefox 7 及之前版本也提供這個(gè)訪問(wèn)，但調(diào)用總返回 null</p>
<p>1126、要從元素的樣式中移除某個(gè) CSS 屬性，需要使用 removeProperty() 方法。使用這個(gè)方法移除一個(gè)屬性，意味著將會(huì)為該屬性應(yīng)用默認(rèn)的樣式（從其他樣式表經(jīng)層疊而來(lái)）</p>
<p>1127、getComputedStyle() 方法。這個(gè)方法接受兩個(gè)參數(shù)：要取得計(jì)算樣式的元素和一個(gè)偽元素字符串（例如 ":after" ）。如果不需要偽元素信息，第二個(gè)參數(shù)可以是 null 。 getComputedStyle() 方法返回一個(gè) CSSStyleDeclaration 對(duì)象（與 style 屬性的類(lèi)型相同），其中包含當(dāng)前元素的所有計(jì)算的樣式。IE 不支持 getComputedStyle() 方法，但它有一種類(lèi)似的概念。在 IE 中，每個(gè)具有 style 屬性的元素還有一個(gè) currentStyle 屬性。這個(gè)屬性是 CSSStyleDeclaration 的實(shí)例，包含當(dāng)前元素全部計(jì)算后的樣式。與 DOM 版本的方式一樣，IE 也沒(méi)有返回 border 樣式，因?yàn)檫@是一個(gè)綜合屬性。無(wú)論在哪個(gè)瀏覽器中，最重要的一條是要記住所有計(jì)算的樣式都是只讀的；不能修改計(jì)算后樣式對(duì)象中的 CSS 屬性。此外，計(jì)算后的樣式也包含屬于瀏覽器內(nèi)部樣式表的樣式信息，因此任何具有默認(rèn)值的 CSS 屬性都會(huì)表現(xiàn)在計(jì)算后的樣式中</p>
<p>1128、CSSStyleSheet 類(lèi)型表示的是樣式表，包括通過(guò) <link> 元素包含的樣式表和在 <b><style></b> 元素中定義的樣式表。有讀者可能記得，這兩個(gè)元素本身分別是由 HTMLLinkElement 和 HTMLStyleElement 類(lèi)型表示的。但是， CSSStyleSheet 類(lèi)型相對(duì)更加通用一些，它只表示樣式表，而不管這些樣式表在 HTML中是如何定義的。此外，上述兩個(gè)針對(duì)元素的類(lèi)型允許修改 HTML特性，但 CSSStyleSheet 對(duì)象則是一套只讀的接口（有一個(gè)屬性例外）。disabled ：表示樣式表是否被禁用的布爾值。這個(gè)屬性是可讀/寫(xiě)的，將這個(gè)值設(shè)置為 true 可以禁用樣式表</p>
<p>1129、其中三個(gè)最常用的屬性是 cssText 、 selectorText 和 style 。 cssText 屬性與 style.cssText屬性類(lèi)似，但并不相同。前者包含選擇符文本和圍繞樣式信息的花括號(hào)，后者只包含樣式信息（類(lèi)似于元素的 style.cssText ）。此外， cssText 是只讀的，而 style.cssText 也可以被重寫(xiě)</p>
<p>1130、 insertRule() 方法接受兩個(gè)參數(shù)：規(guī)則文本和表示在哪里插入規(guī)則的索引。Firefox、Safari、Opera 和 Chrome都支持 insertRule() 方法。IE8 及更早版本支持一個(gè)類(lèi)似的方法，名叫 addRule() ，也接收兩必選參數(shù)：選擇符文本和 CSS樣式信息；一個(gè)可選參數(shù)：插入規(guī)則的位置</p>
<p>1131、從樣式表中刪除規(guī)則的方法是 deleteRule() ，這個(gè)方法接受一個(gè)參數(shù)：要?jiǎng)h除的規(guī)則的位置；IE 支持的類(lèi)似方法叫 removeRule() ，使用方法相同。與添加規(guī)則相似，刪除規(guī)則也不是實(shí)際 Web 開(kāi)發(fā)中常見(jiàn)的做法?？紤]到刪除規(guī)則可能會(huì)影響 CSS層疊的效果，因此請(qǐng)大家慎重使用</p>
<p>1132、偏移量。offsetHeight ：元素在垂直方向上占用的空間大小，以像素計(jì)。包括元素的高度、（可見(jiàn)的）水平滾動(dòng)條的高度、上邊框高度和下邊框高度；offsetWidth ：元素在水平方向上占用的空間大小，以像素計(jì)。包括元素的寬度、（可見(jiàn)的）垂直滾動(dòng)條的寬度、左邊框?qū)挾群陀疫吙驅(qū)挾龋籵ffsetLeft ：元素的左外邊框至包含元素的左內(nèi)邊框之間的像素距離；offsetTop ：元素的上外邊框至包含元素的上內(nèi)邊框之間的像素距離。要想知道某個(gè)元素在頁(yè)面上的偏移量，將這個(gè)元素的 offsetLeft 和 offsetTop 與其 offsetParent的相同屬性相加，如此循環(huán)直至根元素，就可以得到一個(gè)基本準(zhǔn)確的值</p>
<p>1133、所有這些偏移量屬性都是只讀的，而且每次訪問(wèn)它們都需要重新計(jì)算。因此，應(yīng)該盡量避免重復(fù)訪問(wèn)這些屬性；如果需要重復(fù)使用其中某些屬性的值，可以將它們保存在局部變量中，以提高性能</p>
<p>1134、元素的客戶區(qū)大?。╟lient dimension），指的是元素內(nèi)容及其內(nèi)邊距所占據(jù)的空間大小。有關(guān)客戶區(qū)大小的屬性有兩個(gè)： clientWidth 和 clientHeight 。其中， clientWidth 屬性是元素內(nèi)容區(qū)寬度加上左右內(nèi)邊距寬度； clientHeight 屬性是元素內(nèi)容區(qū)高度加上上下內(nèi)邊距高度。注意這兩個(gè)屬性不包含邊框（border）</p>
<p>1135、與偏移量相似，客戶區(qū)大小也是只讀的，也是每次訪問(wèn)都要重新計(jì)算的</p>
<p>1136、有些元素（例如<html> 元素），即使沒(méi)有執(zhí)行任何代碼也能自動(dòng)地添加滾動(dòng)條；但另外一些元素，則需要通過(guò) CSS 的overflow 屬性進(jìn)行設(shè)置才能滾動(dòng)。scrollHeight ：在沒(méi)有滾動(dòng)條的情況下，元素內(nèi)容的總高度；scrollWidth ：在沒(méi)有滾動(dòng)條的情況下，元素內(nèi)容的總寬度；scrollLeft ：被隱藏在內(nèi)容區(qū)域左側(cè)的像素?cái)?shù)。通過(guò)設(shè)置這個(gè)屬性可以改變?cè)氐臐L動(dòng)位置；scrollTop ：被隱藏在內(nèi)容區(qū)域上方的像素?cái)?shù)。通過(guò)設(shè)置這個(gè)屬性可以改變?cè)氐臐L動(dòng)位置</p>
<p>1137、對(duì)于 不 包含 滾動(dòng) 條 的頁(yè) 面而 言 ， scrollWidth 和 scrollHeight 與 clientWidth 和clientHeight 之間的關(guān)系并不十分清晰</p>
<p>1138、在確定文檔的總高度時(shí)（包括基于視口的最小高度時(shí)），必須取得 scrollWidth/clientWidth 和scrollHeight/clientHeight 中的最大值，才能保證在跨瀏覽器的環(huán)境下得到精確的結(jié)果</p>
<p>1139、通過(guò) scrollLeft 和 scrollTop 屬性既可以確定元素當(dāng)前滾動(dòng)的狀態(tài)，也可以設(shè)置元素的滾動(dòng)位置。在元素尚未被滾動(dòng)時(shí)，這兩個(gè)屬性的值都等于 0。如果元素被垂直滾動(dòng)了，那么 scrollTop 的值會(huì)大于 0，且表示元素上方不可見(jiàn)內(nèi)容的像素高度。如果元素被水平滾動(dòng)了，那么 scrollLeft 的值會(huì)大于 0，且表示元素左側(cè)不可見(jiàn)內(nèi)容的像素寬度。這兩個(gè)屬性都是可以設(shè)置的，因此將元素的scrollLeft 和 scrollTop 設(shè)置為 0，就可以重置元素的滾動(dòng)位置</p>
<p>1140、IE、Firefox 3+、Safari 4+、Opera 9.5及 Chrome為每個(gè)元素都提供了一個(gè) getBoundingClientRect() 方法。這個(gè)方法返回會(huì)一個(gè)矩形對(duì)象，包含 4 個(gè)屬性： left 、 top 、 right 和 bottom 。這些屬性給出了元素在頁(yè)面中相對(duì)于視口的位置。但是，瀏覽器的實(shí)現(xiàn)稍有不同。IE8 及更早版本認(rèn)為文檔的左上角坐標(biāo)是(2, 2)，而其他瀏覽器包括 IE9 則將傳統(tǒng)的(0,0)作為起點(diǎn)坐標(biāo)。因此，就需要在一開(kāi)始檢查一下位于(0,0)處的元素的位置，在 IE8 及更早版本中，會(huì)返回(2,2)，而在其他瀏覽器中會(huì)返回(0,0)</p>
<p>1141、對(duì)于不支持 getBoundingClientRect() 的瀏覽器，可以通過(guò)其他手段取得相同的信息。一般來(lái)說(shuō)， right 和 left 的差值與 offsetWidth 的值相等，而 bottom 和 top 的差值與 offsetHeight相等。而且， left 和 top 屬性大致等于使用本章前面定義的 getElementLeft() 和 getElementTop()函數(shù)取得的值</p>
<p>1142、DOM2 級(jí)在 Document 類(lèi)型中定義了 createRange() 方法。在兼容 DOM 的瀏覽器中，這個(gè)方法屬于 document 對(duì)象。使用 hasFeature() 或者直接檢測(cè)該方法，都可以確定瀏覽器是否支持范圍</p>
<p>1143、要使用范圍來(lái)選擇文檔中的一部分，最簡(jiǎn)的方式就是使用 selectNode() 或 selectNodeContents() 。這兩個(gè)方法都接受一個(gè)參數(shù)，即一個(gè) DOM 節(jié)點(diǎn)，然后使用該節(jié)點(diǎn)中的信息來(lái)填充范圍。其中，selectNode() 方法選擇整個(gè)節(jié)點(diǎn)，包括其子節(jié)點(diǎn)；而 selectNodeContents() 方法則只選擇節(jié)點(diǎn)的子節(jié)點(diǎn)</p>
<p>1144、要?jiǎng)?chuàng)建復(fù)雜的范圍就得使用 setStart() 和 setEnd() 方法。這兩個(gè)方法都接受兩個(gè)參數(shù)：一個(gè)參照節(jié)點(diǎn)和一個(gè)偏移量值。對(duì) setStart() 來(lái)說(shuō)，參照節(jié)點(diǎn)會(huì)變成 startContainer ，而偏移量值會(huì)變成startOffset 。對(duì)于 setEnd() 來(lái)說(shuō)，參照節(jié)點(diǎn)會(huì)變成 endContainer ，而偏移量值會(huì)變成 endOffset</p>
<p>1145、使用 insertNode()方法可以向范圍選區(qū)的開(kāi)始處插入一個(gè)節(jié)點(diǎn)。<b><span></b> 正好被插入到了 "Hello" 中的 "llo" 前面，而該位置就是范圍選區(qū)的開(kāi)始位置。還要注意的是，由于這里沒(méi)有使用上一節(jié)介紹的方法，結(jié)果原始的 HTML 并沒(méi)有添加或刪除 <b><b></b> 元素。使用這種技術(shù)可以插入一些幫助提示信息，例如在打開(kāi)新窗口的鏈接旁邊插入一幅圖像</p>
<p>1146、除了向范圍內(nèi)部插入內(nèi)容之外，還可以環(huán)繞范圍插入內(nèi)容，此時(shí)就要使用 surroundContents()方法。這個(gè)方法接受一個(gè)參數(shù)，即環(huán)繞范圍內(nèi)容的節(jié)點(diǎn)。在環(huán)繞范圍插入內(nèi)容時(shí)，后臺(tái)會(huì)執(zhí)行下列步驟：提取出范圍中的內(nèi)容（類(lèi)似執(zhí)行 extractContent() ）；將給定節(jié)點(diǎn)插入到文檔中原來(lái)范圍所在的位置上；將文檔片段的內(nèi)容添加到給定節(jié)點(diǎn)中</p>
<p>1147、所謂折疊范圍，就是指范圍中未選擇文檔的任何部分。使用 collapse() 方法來(lái)折疊范圍，這個(gè)方法接受一個(gè)參數(shù)，一個(gè)布爾值，表示要折疊到范圍的哪一端。參數(shù) true 表示折疊到范圍的起點(diǎn)，參數(shù) false 表示折疊到范圍的終點(diǎn)。要確定范圍已經(jīng)折疊完畢，可以檢查 collapsed 屬性</p>
<p>1148、可以使用 cloneRange() 方法復(fù)制范圍。這個(gè)方法會(huì)創(chuàng)建調(diào)用它的范圍的一個(gè)副本。新創(chuàng)建的范圍與原來(lái)的范圍包含相同的屬性，而修改它的端點(diǎn)不會(huì)影響原來(lái)的范圍</p>
<p>1149、在使用完范圍之后，最好是調(diào)用 detach() 方法，以便從創(chuàng)建范圍的文檔中分離出該范圍。調(diào)用detach() 之后，就可以放心地解除對(duì)范圍的引用，從而讓垃圾回收機(jī)制回收其內(nèi)存了</p>
<p>1150、IE9、Firefox、Opera、Safari 和 Chrome 全都已經(jīng)實(shí)現(xiàn)了“DOM2 級(jí)事件”模塊的核心部分。IE8 是最后一個(gè)仍然使用其專(zhuān)有事件系統(tǒng)的主要瀏覽器</p>
<b>第十三章 事件</b>
<p>1301、事件流描述的是從頁(yè)面中接收事件的順序。但有意思的是，IE 和 Netscape 開(kāi)發(fā)團(tuán)隊(duì)居然提出了差不多是完全相反的事件流的概念。IE 的事件流是事件冒泡流，而 Netscape Communicator 的事件流是事件捕獲流</p>
<p>1302、IE 的事件流叫做事件冒泡（event bubbling），即事件開(kāi)始時(shí)由最具體的元素（文檔中嵌套層次最深的那個(gè)節(jié)點(diǎn)）接收，然后逐級(jí)向上傳播到較為不具體的節(jié)點(diǎn)（文檔）</p>
<p>1303、Netscape Communicator團(tuán)隊(duì)提出的另一種事件流叫做事件捕獲（event capturing）。事件捕獲的思想是不太具體的節(jié)點(diǎn)應(yīng)該更早接收到事件，而最具體的節(jié)點(diǎn)應(yīng)該最后接收到事件。事件捕獲的用意在于在事件到達(dá)預(yù)定目標(biāo)之前捕獲它</p>
<p>1304、雖然事件捕獲是 Netscape Communicator 唯一支持的事件流模型，但 IE9、Safari、Chrome、Opera和 Firefox 目前也都支持這種事件流模型。盡管“DOM2 級(jí)事件”規(guī)范要求事件應(yīng)該從 document 對(duì)象開(kāi)始傳播，但這些瀏覽器都是從 window 對(duì)象開(kāi)始捕獲事件的。</p>
<p>1305、由于老版本的瀏覽器不支持，因此很少有人使用事件捕獲。我們也建議讀者放心地使用事件冒泡，在有特殊需要時(shí)再使用事件捕獲</p>
<p>1306、“DOM2級(jí)事件”規(guī)定的事件流包括三個(gè)階段：事件捕獲階段、處于目標(biāo)階段和事件冒泡階段。首先發(fā)生的是事件捕獲，為截獲事件提供了機(jī)會(huì)。然后是實(shí)際的目標(biāo)接收到事件。最后一個(gè)階段是冒泡階段，可以在這個(gè)階段對(duì)事件做出響應(yīng)</p>
<p>1307、在 DOM 事件流中，實(shí)際的目標(biāo)（ <div> 元素）在捕獲階段不會(huì)接收到事件</p>
<p>1308、多數(shù)支持 DOM事件流的瀏覽器都實(shí)現(xiàn)了一種特定的行為；即使“DOM2 級(jí)事件”規(guī)范明確要求捕獲階段不會(huì)涉及事件目標(biāo)，但 IE9、Safari、Chrome、Firefox 和 Opera 9.5 及更高版本都會(huì)在捕獲階段觸發(fā)事件對(duì)象上的事件。結(jié)果，就是有兩個(gè)機(jī)會(huì)在目標(biāo)對(duì)象上面操作事件。IE9、Opera、Firefox、Chrome 和 Safari 都支持 DOM 事件流；IE8 及更早版本不支持 DOM 事件流。</p>
<p>1309、將事件處理程序設(shè)置為 null 之后，再單擊按鈕將不會(huì)有任何動(dòng)作發(fā)生</p>
<p>1310、“DOM2級(jí)事件”定義了兩個(gè)方法，用于處理指定和刪除事件處理程序的操作： addEventListener()和 removeEventListener() 。所有 DOM 節(jié)點(diǎn)中都包含這兩個(gè)方法，并且它們都接受 3 個(gè)參數(shù)：要處理的事件名、作為事件處理程序的函數(shù)和一個(gè)布爾值。最后這個(gè)布爾值參數(shù)如果是 true ，表示在捕獲階段調(diào)用事件處理程序；如果是 false ，表示在冒泡階段調(diào)用事件處理程序</p>
<p>1311、通過(guò) addEventListener() 添加的事件處理程序只能使用 removeEventListener() 來(lái)移除；移除時(shí)傳入的參數(shù)與添加處理程序時(shí)使用的參數(shù)相同。這也意味著通過(guò) addEventListener() 添加的匿名函數(shù)將無(wú)法移除。把傳入的匿名函數(shù)賦給一個(gè)變量，在添加事件監(jiān)聽(tīng)或移除事件監(jiān)聽(tīng)使用該變量可以移除</p>
<p>1312、大多數(shù)情況下，都是將事件處理程序添加到事件流的冒泡階段，這樣可以最大限度地兼容各種瀏覽器。最好只在需要在事件到達(dá)目標(biāo)之前截獲它的時(shí)候?qū)⑹录幚沓绦蛱砑拥讲东@階段。如果不是特別需要，我們不建議在事件捕獲階段注冊(cè)事件處理程序</p>
<p>1313、IE 實(shí)現(xiàn)了與 DOM 中類(lèi)似的兩個(gè)方法： attachEvent() 和 detachEvent() 。這兩個(gè)方法接受相同的兩個(gè)參數(shù)：事件處理程序名稱(chēng)與事件處理程序函數(shù)。由于 IE8 及更早版本只支持事件冒泡，所以通過(guò)attachEvent() 添加的事件處理程序都會(huì)被添加到冒泡階段。注意， attachEvent() 的第一個(gè)參數(shù)是 "onclick" ，而非 DOM 的 addEventListener() 方法中的 "click"</p>
<p>1314、在 IE 中使用 attachEvent() 與使用 DOM0 級(jí)方法的主要區(qū)別在于事件處理程序的作用域。在使用 DOM0 級(jí)方法的情況下，事件處理程序會(huì)在其所屬元素的作用域內(nèi)運(yùn)行；在使用 attachEvent() 方法的情況下，事件處理程序會(huì)在全局作用域中運(yùn)行，因此 this 等于 window</p>
<p>1315、這里調(diào)用了兩次 attachEvent() ，為同一個(gè)按鈕添加了兩個(gè)不同的事件處理程序。不過(guò)，與 DOM方法不同的是，這些事件處理程序不是以添加它們的順序執(zhí)行，而是以相反的順序被觸發(fā)</p>
<p>1316、使用 attachEvent() 添加的事件可以通過(guò) detachEvent() 來(lái)移除，條件是必須提供相同的參數(shù)。與 DOM 方法一樣，這也意味著添加的匿名函數(shù)將不能被移除。不過(guò)，只要能夠?qū)?duì)相同函數(shù)的引用傳給 detachEvent() ，就可以移除相應(yīng)的事件處理程序</p>
<p>1317、在觸發(fā) DOM 上的某個(gè)事件時(shí)，會(huì)產(chǎn)生一個(gè)事件對(duì)象 event ，這個(gè)對(duì)象中包含著所有與事件有關(guān)的信息。包括導(dǎo)致事件的元素、事件的類(lèi)型以及其他與特定事件相關(guān)的信息。例如，鼠標(biāo)操作導(dǎo)致的事件對(duì)象中，會(huì)包含鼠標(biāo)位置的信息，而鍵盤(pán)操作導(dǎo)致的事件對(duì)象中，會(huì)包含與按下的鍵有關(guān)的信息。所有瀏覽器都支持 event 對(duì)象，但支持方式不同</p>
<p>1318、在事件處理程序內(nèi)部，對(duì)象 this 始終等于 currentTarget 的值，而 target 則只包含事件的實(shí)際目標(biāo)。如果直接將事件處理程序指定給了目標(biāo)元素，則 this 、 currentTarget 和 target 包含相同的值。如果事件處理程序存在于按鈕的父節(jié)點(diǎn)中（例如 document.body ），那么這些值是不相同的</p>
<p>1319、事件委托是通過(guò)事件冒泡來(lái)實(shí)現(xiàn)的</p>
<p>1320、要阻止特定事件的默認(rèn)行為，可以使用 preventDefault() 方法。例如，鏈接的默認(rèn)行為就是在被單擊時(shí)會(huì)導(dǎo)航到其 href 特性指定的 URL。如果你想阻止鏈接導(dǎo)航這一默認(rèn)行為，那么通過(guò)鏈接的onclick 事件處理程序可以取消它</p>
<p>1321、只有 cancelable 屬性設(shè)置為 true 的事件，才可以使用 preventDefault() 來(lái)取消其默認(rèn)行為</p>
<p>1322、 stopPropagation() 方法用于立即停止事件在 DOM 層次中的傳播，即取消進(jìn)一步的事件捕獲或冒泡</p>
<p>1323、事件對(duì)象的eventPhase屬性，可以用來(lái)確定事件當(dāng)前正位于事件流的哪個(gè)階段。如果是在捕獲階段調(diào)用的事件處理程序，那么 eventPhase 等于 1 ；如果事件處理程序處于目標(biāo)對(duì)象上，則event-Phase等于2；如果是在冒泡階段調(diào)用的事件處理程序， eventPhase 等于 3</p>
<p>1324、只有在事件處理程序執(zhí)行期間， event 對(duì)象才會(huì)存在；一旦事件處理程序執(zhí)行完成， event 對(duì)象就會(huì)被銷(xiāo)毀</p>
<p>1325、 returnValue 屬性相當(dāng)于 DOM中的 preventDefault() 方法，它們的作用都是取消給定事件的默認(rèn)行為。只要將 returnValue 設(shè)置為 false ，就可以阻止默認(rèn)行為</p>
<p>1326、cancelBubble 屬性與 DOM 中的 stopPropagation() 方法作用相同，都是用來(lái)停止事件冒泡的。由于 IE 不支持事件捕獲，因而只能取消事件冒泡；但 stopPropagatioin() 可以同時(shí)取消事件捕獲和冒泡</p>
<p>1327、在 onclick 事件處理程序中將 cancelBubble 設(shè)置為 true ，就可阻止事件通過(guò)冒泡而觸發(fā)document.body 中注冊(cè)的事件處理程序</p>
<p>1328、JavaScript 中最常用的一個(gè)事件就是 load 。當(dāng)頁(yè)面完全加載后（包括所有圖像、JavaScript 文件、CSS 文件等外部資源），就會(huì)觸發(fā) window 上面的 load 事件</p>
<p>1329、與 load 事件對(duì)應(yīng)的是 unload 事件，這個(gè)事件在文檔被完全卸載后觸發(fā)。只要用戶從一個(gè)頁(yè)面切換到另一個(gè)頁(yè)面，就會(huì)發(fā)生 unload 事件</p>
<p>1330、當(dāng)瀏覽器窗口被調(diào)整到一個(gè)新的高度或?qū)挾葧r(shí)，就會(huì)觸發(fā) resize 事件。這個(gè)事件在 window （窗口）上面觸發(fā)，因此可以通過(guò) JavaScript 或者 <body> 元素中的 onresize 特性來(lái)指定事件處理程序</p>
<p>1331、關(guān)于何時(shí)會(huì)觸發(fā) resize 事件，不同瀏覽器有不同的機(jī)制。IE、Safari、Chrome 和 Opera 會(huì)在瀏覽器窗口變化了 1 像素時(shí)就觸發(fā) resize 事件，然后隨著變化不斷重復(fù)觸發(fā)。Firefox 則只會(huì)在用戶停止調(diào)整窗口大小時(shí)才會(huì)觸發(fā) resize 事件。由于存在這個(gè)差別，應(yīng)該注意不要在這個(gè)事件的處理程序中加入大計(jì)算量的代碼，因?yàn)檫@些代碼有可能被頻繁執(zhí)行，從而導(dǎo)致瀏覽器反應(yīng)明顯變慢。瀏覽器窗口最小化或最大化時(shí)也會(huì)觸發(fā) resize 事件</p>
<p>1332、焦點(diǎn)事件會(huì)在頁(yè)面元素獲得或失去焦點(diǎn)時(shí)觸發(fā)。利用這些事件并與document.hasFocus()方法及document.activeElement 屬性配合，可以知曉用戶在頁(yè)面上的行蹤</p>
<p>1333、 focus 和 blur ，它們都是 JavaScript 早期就得到所有瀏覽器支持的事件。這些事件的最大問(wèn)題是它們不冒泡。因此，IE 的 focusin 和 focusout 與 Opera 的 DOMFocusIn和 DOMFocusOut 才會(huì)發(fā)生重疊。IE 的方式最后被 DOM3 級(jí)事件采納為標(biāo)準(zhǔn)方式</p>
<p>1334、鼠標(biāo)事件中還有一類(lèi)滾輪事件。而說(shuō)是一類(lèi)事件，其實(shí)就是一個(gè) mousewheel 事件。這個(gè)事件跟蹤鼠標(biāo)滾輪，類(lèi)似于 Mac 的觸控板</p>
<p>1335、鼠標(biāo)事件都是在瀏覽器視口中的特定位置上發(fā)生的。這個(gè)位置信息保存在事件對(duì)象的 clientX 和clientY 屬性中。所有瀏覽器都支持這兩個(gè)屬性，它們的值表示事件發(fā)生時(shí)鼠標(biāo)指針在視口中的水平和垂直坐標(biāo)。注意，這些值中不包括頁(yè)面滾動(dòng)的距離，因此這個(gè)位置并不表示鼠標(biāo)在頁(yè)面上的位置。</p>
<p>1336、頁(yè)面坐標(biāo)通過(guò)事件對(duì)象的pageX和pageY屬性，能告訴你事件是在頁(yè)面中的什么位置發(fā)生的。換句話說(shuō)，這兩個(gè)屬性表示鼠標(biāo)光標(biāo)在頁(yè)面中的位置，因此坐標(biāo)是從頁(yè)面本身而非視口的左邊和頂邊計(jì)算的</p>
<p>1337、IE8 及更早版本不支持事件對(duì)象上的頁(yè)面坐標(biāo)，不過(guò)使用客戶區(qū)坐標(biāo)和滾動(dòng)信息可以計(jì)算出來(lái)。這時(shí)候需要用到 document.body （混雜模式）或 document.documentElement （標(biāo)準(zhǔn)模式）中的scrollLeft 和 scrollTop 屬性</p>
<p>1338、通過(guò) screenX 和 screenY 屬性就可以確定鼠標(biāo)事件發(fā)生時(shí)鼠標(biāo)指針相對(duì)于整個(gè)屏幕的坐標(biāo)信息</p>
<p>1339、雖然鼠標(biāo)事件主要是使用鼠標(biāo)來(lái)觸發(fā)的，但在按下鼠標(biāo)時(shí)鍵盤(pán)上的某些鍵的狀態(tài)也可以影響到所要采取的操作。這些修改鍵就是 Shift、Ctrl、Alt 和 Meta（在 Windows鍵盤(pán)中是 Windows鍵，在蘋(píng)果機(jī)中是 Cmd 鍵），它們經(jīng)常被用來(lái)修改鼠標(biāo)事件的行為。DOM 為此規(guī)定了 4 個(gè)屬性，表示這些修改鍵的狀態(tài)： shiftKey 、 ctrlKey 、 altKey 和 metaKey 。這些屬性中包含的都是布爾值，如果相應(yīng)的鍵被按下了，則值為 true ，否則值為 false 。當(dāng)某個(gè)鼠標(biāo)事件發(fā)生時(shí)，通過(guò)檢測(cè)這幾個(gè)屬性就可以確定用戶是否同時(shí)按下了其中的鍵</p>
<p>1340、DOM通過(guò) event 對(duì)象的 relatedTarget 屬性提供了相關(guān)元素的信息。這個(gè)屬性只對(duì)于 mouseover和 mouseout 事件才包含值；對(duì)于其他事件，這個(gè)屬性的值是 null</p>
<p>1341、只有在主鼠標(biāo)按鈕被單擊（或鍵盤(pán)回車(chē)鍵被按下）時(shí)才會(huì)觸發(fā) click事件，因此檢測(cè)按鈕的信息并不是必要的。但對(duì)于 mousedown 和 mouseup 事件來(lái)說(shuō)，則在其 event 對(duì)象存在一個(gè) button 屬性，表示按下或釋放的按鈕。DOM 的 button 屬性可能有如下 3 個(gè)值： 0 表示主鼠標(biāo)按鈕， 1 表示中間的鼠標(biāo)按鈕（鼠標(biāo)滾輪按鈕）， 2 表示次鼠標(biāo)按鈕</p>
<p>1342、“DOM2 級(jí)事件”規(guī)范在 event 對(duì)象中還提供了 detail 屬性，用于給出有關(guān)事件的更多信息。對(duì)于鼠標(biāo)事件來(lái)說(shuō)， detail 中包含了一個(gè)數(shù)值，表示在給定位置上發(fā)生了多少次單擊。在同一個(gè)元素上相繼地發(fā)生一次 mousedown 和一次 mouseup 事件算作一次單擊。 detail 屬性從 1 開(kāi)始計(jì)數(shù)，每次單擊發(fā)生后都會(huì)遞增</p>
<p>1343、IE 6.0 首先實(shí)現(xiàn)了 mousewheel 事件。此后，Opera、Chrome 和 Safari 也都實(shí)現(xiàn)了這個(gè)事件。當(dāng)用戶通過(guò)鼠標(biāo)滾輪與頁(yè)面交互、在垂直方向上滾動(dòng)頁(yè)面時(shí)（無(wú)論向上還是向下），就會(huì)觸發(fā) mousewheel事件。這個(gè)事件可以在任何元素上面觸發(fā)，最終會(huì)冒泡到 document （IE8）或 window （IE9、Opera、Chrome 及 Safari）對(duì)象。與 mousewheel 事件對(duì)應(yīng)的 event 對(duì)象除包含鼠標(biāo)事件的所有標(biāo)準(zhǔn)信息外，還包含一個(gè)特殊的 wheelDelta 屬性。當(dāng)用戶向前滾動(dòng)鼠標(biāo)滾輪時(shí)， wheelDelta 是 120 的倍數(shù)；當(dāng)用戶向后滾動(dòng)鼠標(biāo)滾輪時(shí)， wheelDelta 是?120 的倍數(shù)。</p>
<p>1344、多數(shù)情況下，只要知道鼠標(biāo)滾輪滾動(dòng)的方向就夠了，而這通過(guò)檢測(cè) wheelDelta 的正負(fù)號(hào)就可以確定。有一點(diǎn)要注意：在 Opera 9.5 之前的版本中， wheelDelta 值的正負(fù)號(hào)是顛倒的。如果你打算支持早期的 Opera 版本，就需要使用瀏覽器檢測(cè)技術(shù)來(lái)確定實(shí)際的值</p>
<p>1345、鍵盤(pán)事件keydown、keypress、keyup與鼠標(biāo)事件一樣，都支持相同的修改鍵。而且，鍵盤(pán)事件的事件對(duì)象中也有 shiftKey 、 ctrlKey 、 altKey 和 metaKey 屬性。IE 不支持 metaKey</p>
<p>1346、鍵碼在發(fā)生 keydown 和 keyup 事件時(shí)， event 對(duì)象的 keyCode 屬性中會(huì)包含一個(gè)代碼，與鍵盤(pán)上一個(gè)特定的鍵對(duì)應(yīng)。對(duì)數(shù)字字母字符鍵， keyCode 屬性的值與 ASCII 碼中對(duì)應(yīng)小寫(xiě)字母或數(shù)字的編碼相同</p>
<p>1347、發(fā)生 keypress 事件意味著按下的鍵會(huì)影響到屏幕中文本的顯示。在所有瀏覽器中，按下能夠插入或刪除字符的鍵都會(huì)觸發(fā) keypress 事件；按下其他鍵能否觸發(fā)此事件因?yàn)g覽器而異</p>
<p>1348、IE8及之前版本和Opera則是在 keyCode 中保存字符的ASCII編碼。要想以跨瀏覽器的方式取得字符編碼，必須首先檢測(cè) charCode 屬性是否可用，如果不可用則使用 keyCode。在取得了字符編碼之后，就可以使用 String.fromCharCode() 將其轉(zhuǎn)換成實(shí)際的字符</p>
<p>1349、盡管所有瀏覽器都實(shí)現(xiàn)了某種形式的鍵盤(pán)事件，DOM3 級(jí)事件還是做出了一些改變。比如，DOM3級(jí)事件中的鍵盤(pán)事件，不再包含 charCode 屬性，而是包含兩個(gè)新屬性： key 和 char。其中， key 屬性是為了取代 keyCode 而新增的，它的值是一個(gè)字符串。在按下某個(gè)字符鍵時(shí)， key的值就是相應(yīng)的文本字符（如“k”或“M”）；在按下非字符鍵時(shí)， key 的值是相應(yīng)鍵的名（如“Shift”或“Down”）。而 char 屬性在按下字符鍵時(shí)的行為與 key 相同，但在按下非字符鍵時(shí)值為 null。由于存在跨瀏覽器問(wèn)題，因此本書(shū)不推薦使用 key 、 keyIdentifier 或 char</p>
<p>1350、 event 對(duì)象上還有一個(gè)屬性，叫 inputMethod ，表示把文本輸入到文本框中的方式。 1，表示是使用鍵盤(pán)輸入的；2，表示文本是粘貼進(jìn)來(lái)的； 3，表示文本是拖放進(jìn)來(lái)的； 7，表示文本是通過(guò)語(yǔ)音輸入的</p>
<p>1351、支持 textInput 屬性的瀏覽器有 IE9+、Safari 和 Chrome。只有 IE 支持 inputMethod 屬性</p>
<p>1352、在所有瀏覽器中都可以取消這個(gè)事件：在兼容 DOM 的瀏覽器中，使用 event.preventDefalut() ；在 IE 中，將 event.returnValue 的值設(shè)置為 false 。因?yàn)?contextmenu 事件屬于鼠標(biāo)事件，所以其事件對(duì)象中包含與光標(biāo)位置有關(guān)的所有屬性。通常使用 contextmenu 事件來(lái)顯示自定義的上下文菜單，而使用 onclick 事件處理程序來(lái)隱藏該菜單。支持 contextmenu 事件的瀏覽器有 IE、Firefox、Safari、Chrome 和 Opera 11+</p>
<p>1353、之所以有發(fā)生在 window 對(duì)象上的 beforeunload 事件，是為了讓開(kāi)發(fā)人員有可能在頁(yè)面卸載前阻止這一操作。這個(gè)事件會(huì)在瀏覽器卸載頁(yè)面之前觸發(fā)，可以通過(guò)它來(lái)取消卸載并繼續(xù)使用原有頁(yè)面。但是，不能徹底取消這個(gè)事件，因?yàn)槟蔷拖喈?dāng)于讓用戶無(wú)法離開(kāi)當(dāng)前頁(yè)面了。為此，這個(gè)事件的意圖是將控制權(quán)交給用戶。顯示的消息會(huì)告知用戶頁(yè)面行將被卸載（正因?yàn)槿绱瞬艜?huì)顯示這個(gè)消息），詢問(wèn)用戶是否真的要關(guān)閉頁(yè)面，還是希望繼續(xù)留下來(lái)。IE 和 Firefox、Safari 和 Chrome 都支持 beforeunload 事件，也都會(huì)彈出這個(gè)對(duì)話框詢問(wèn)用戶是否真想離開(kāi)。Opera 11 及之前的版本不支持 beforeunload 事件</p>
<p>1354、touchstart ：當(dāng)手指觸摸屏幕時(shí)觸發(fā)；即使已經(jīng)有一個(gè)手指放在了屏幕上也會(huì)觸發(fā)。touchmove ：當(dāng)手指在屏幕上滑動(dòng)時(shí)連續(xù)地觸發(fā)。在這個(gè)事件發(fā)生期間，調(diào)用 preventDefault()可以阻止?jié)L動(dòng)。touchend ：當(dāng)手指從屏幕上移開(kāi)時(shí)觸發(fā)。touchcancel ：當(dāng)系統(tǒng)停止跟蹤觸摸時(shí)觸發(fā)。關(guān)于此事件的確切觸發(fā)時(shí)間，文檔中沒(méi)有明確說(shuō)明。上面這幾個(gè)事件都會(huì)冒泡，也都可以取消</p>
<p>1355、gesturestart ：當(dāng)一個(gè)手指已經(jīng)按在屏幕上而另一個(gè)手指又觸摸屏幕時(shí)觸發(fā)。gesturechange ：當(dāng)觸摸屏幕的任何一個(gè)手指的位置發(fā)生變化時(shí)觸發(fā)。gestureend ：當(dāng)任何一個(gè)手指從屏幕上面移開(kāi)時(shí)觸發(fā)。</p>
<p>1356、事件委托利用了事件冒泡，只指定一個(gè)事件處理程序，就可以管理某一類(lèi)型的所有事件。使用事件委托，只需在DOM 樹(shù)中盡量最高的層次上添加一個(gè)事件處理程序。最適合采用事件委托技術(shù)的事件包括 click 、 mousedown 、 mouseup 、 keydown 、 keyup 和 keypress 。雖然 mouseover 和 mouseout 事件也冒泡，但要適當(dāng)處理它們并不容易，而且經(jīng)常需要計(jì)算元素的位置</p>
<p>1357、第一種情況就是從文檔中移除帶有事件處理程序的元素時(shí)。這可能是通過(guò)純粹的 DOM 操作，例如使用 removeChild() 和 replaceChild() 方法，但更多地是發(fā)生在使用 innerHTML 替換頁(yè)面中某一部分的時(shí)候。如果帶有事件處理程序的元素被 innerHTML 刪除了，那么原來(lái)添加到元素中的事件處理程序極有可能無(wú)法被當(dāng)作垃圾回收；導(dǎo)致“空事件處理程序”的另一種情況，就是卸載頁(yè)面的時(shí)候</p>
<b>第十四章 表單腳本</b>
<p>1401、在以調(diào)用 submit() 方法的形式提交表單時(shí)，不會(huì)觸發(fā) submit 事件，因此要記得在調(diào)用此方法之前先驗(yàn)證表單數(shù)據(jù)</p>
<p>1402、提交表單時(shí)可能出現(xiàn)的最大問(wèn)題，就是重復(fù)提交表單。在第一次提交表單后，如果長(zhǎng)時(shí)間沒(méi)有反應(yīng)，用戶可能會(huì)變得不耐煩。這時(shí)候，他們也許會(huì)反復(fù)單擊提交按鈕。結(jié)果往往很麻煩（因?yàn)榉?wù)器要處理重復(fù)的請(qǐng)求），或者會(huì)造成錯(cuò)誤（如果用戶是下訂單，那么可能會(huì)多訂好幾份）。解決這一問(wèn)題的辦法有兩個(gè)：在第一次提交表單后就禁用提交按鈕，或者利用 onsubmit 事件處理程序取消后續(xù)的表單提交操作</p>
<p>1403、每個(gè)表單都有elements 屬性，該屬性是表單中所有表單元素（字段）的集合。這個(gè) elements 集合是一個(gè)有序列表，其中包含著表單中的所有字段，例如 <b><input> 、 <textarea> 、 <button> 和 <fieldset></b> 。每個(gè)表單字段在 elements 集合中的順序，與它們出現(xiàn)在標(biāo)記中的順序相同，可以按照位置和 name 特性來(lái)訪問(wèn)它們。如果有多個(gè)表單控件都在使用一個(gè) name （如單選按鈕），那么就會(huì)返回以該 name 命名的一個(gè)NodeList</p>
<p>1404、很多用戶可能會(huì)重復(fù)單擊表單的提交按鈕。在涉及信用卡消費(fèi)時(shí)，這就是個(gè)問(wèn)題：因?yàn)闀?huì)導(dǎo)致費(fèi)用翻番。為此，最常見(jiàn)的解決方案，就是在第一次單擊后就禁用提交按鈕。只要偵聽(tīng) submit 事件，并在該事件發(fā)生時(shí)禁用提交按鈕即可</p>
<p>1405、HTML5 為表單字段新增了一個(gè) autofocus 屬性。在支持這個(gè)屬性的瀏覽器中，只要設(shè)置這個(gè)屬性，不用 JavaScript 就能自動(dòng)把焦點(diǎn)移動(dòng)到相應(yīng)字段</p>
<p>1406、在默認(rèn)情況下，只有表單字段可以獲得焦點(diǎn)。對(duì)于其他元素而言，如果先將其tabIndex 屬性設(shè)置為?1，然后再調(diào)用 focus() 方法，也可以讓這些元素獲得焦點(diǎn)。只有 Opera 不支持這種技術(shù)</p>
<p>1407、關(guān)于 blur 和 change 事件的關(guān)系，并沒(méi)有嚴(yán)格的規(guī)定。在某些瀏覽器中， blur事件會(huì)先于 change 事件發(fā)生；而在其他瀏覽器中，則恰好相反。為此，不能假定這兩個(gè)事件總會(huì)以某種順序依次觸發(fā)，這一點(diǎn)要特別注意</p>
<p>1408、要表現(xiàn)文本框，必須將 <b><input></b> 元素的 type 特性設(shè)置為 "text" 。而通過(guò)設(shè)置 size 特性，可以指定文本框中能夠顯示的字符數(shù)。通過(guò) value 特性，可以設(shè)置文本框的初始值，而 maxlength 特性則用于指定文本框可以接受的最大字符數(shù)</p>
<p>1409、<b><textarea></b> 元素則始終會(huì)呈現(xiàn)為一個(gè)多行文本框。要指定文本框的大小，可以使用 rows和 cols 特性。其中， rows 特性指定的是文本框的字符行數(shù)，而 cols 特性指定的是文本框的字符列數(shù)（類(lèi)似于 <b><inpu></b> 元素的 size 特性）。與 <b><input></b> 元素不同， <b><textarea></b> 的初始值必須要放在<b><textarea></b> 和 <b></textarea></b> 之間</p>
<p>1410、 select() 方法，這個(gè)方法用于選擇文本框中的所有文本。在調(diào)用 select()方法時(shí)，大多數(shù)瀏覽器（Opera 除外）都會(huì)將焦點(diǎn)設(shè)置到文本框中。這個(gè)方法不接受參數(shù)，可以在任何時(shí)候被調(diào)用</p>
<p>420、 select 事件。在選擇了文本框中的文本時(shí)，就會(huì)觸發(fā) select事件。不過(guò)，到底什么時(shí)候觸發(fā) select 事件，還會(huì)因?yàn)g覽器而異。在 IE9+、Opera、Firefox、Chrome和 Safari 中，只有用戶選擇了文本（而且要釋放鼠標(biāo)），才會(huì)觸發(fā) select 事件。而在 IE8 及更早版本中，只要用戶選擇了一個(gè)字母（不必釋放鼠標(biāo)），就會(huì)觸發(fā) select 事件。另外，在調(diào)用 select() 方法時(shí)也會(huì)觸發(fā) select 事件</p>
<p>1411、取得選擇的文本。HTML5 通過(guò)一些擴(kuò)展方案解決了這個(gè)問(wèn)題，以便更順利地取得選擇的文本。該規(guī)范采取的辦法是添加兩個(gè)屬性： selectionStart 和 selectionEnd 。這兩個(gè)屬性中保存的是基于 0 的數(shù)值，表示所選擇文本的范圍（即文本選區(qū)開(kāi)頭和結(jié)尾的偏移量）</p>
<p>1412、HTML5也為選擇文本框中的部分文本提供了解決方案 ， 即 最 早 由 Firefox 引 入 的setSelectionRange() 方法?，F(xiàn)在除 select() 方法之外，所有文本框都有一個(gè) setSelectionRange()方法。這個(gè)方法接收兩個(gè)參數(shù)：要選擇的第一個(gè)字符的索引和要選擇的最后一個(gè)字符之后的字符的索引（類(lèi)似于 substring() 方法的兩個(gè)參數(shù)）</p>
<p>1413、 clipboardData 對(duì)象有三個(gè)方法： getData() 、 setData() 和 clearData() 。其中， getData()用于從剪貼板中取得數(shù)據(jù)，它接受一個(gè)參數(shù)，即要取得的數(shù)據(jù)的格式； setData() 方法的第一個(gè)參數(shù)也是數(shù)據(jù)類(lèi)型，第二個(gè)參數(shù)是要放在剪貼板中的文本</p>
<p>1414、任何標(biāo)注有 required 的字段，在提交表單時(shí)都不能空著。這個(gè)屬性適用于 <b><input> 、 <textarea>和 <select></b> 字段（Opera 11 及之前版本還不支持 <b><select></b> 的 required 屬性）。在 JavaScript 中，通過(guò)對(duì)應(yīng)的 required 屬性，可以檢查某個(gè)表單字段是否為必填字段</p>
<p>1415、HTML5 為文本字段新增了 pattern 屬性。這個(gè)屬性的值是一個(gè)正則表達(dá)式，用于匹配文本框中的值</p>
<p>1416、使用 checkValidity() 方法可以檢測(cè)表單中的某個(gè)字段是否有效。所有表單字段都有個(gè)方法，如果字段的值有效，這個(gè)方法返回 true ，否則返回 false 。字段的值是否有效的判斷依據(jù)是本節(jié)前面介紹過(guò)的那些約束。換句話說(shuō)，必填字段中如果沒(méi)有值就是無(wú)效的，而字段中的值與 pattern 屬性不匹配也是無(wú)效的</p>
<p>1417、要檢測(cè)整個(gè)表單是否有效，可以在表單自身調(diào)用 checkValidity() 方法。如果所有表單字段都有效，這個(gè)方法返回 true ；即使有一個(gè)字段無(wú)效，這個(gè)方法也會(huì)返回 false</p>
<p>1418、對(duì)于只允許選擇一項(xiàng)的選擇框，訪問(wèn)選中項(xiàng)的最簡(jiǎn)單方式，就是使用選擇框的 selectedIndex 屬性</p>
<p>1419、與 selectedIndex 不同，在允許多選的選擇框中設(shè)置選項(xiàng)的 selected 屬性，不會(huì)取消對(duì)其他選中項(xiàng)的選擇，因而可以動(dòng)態(tài)選中任意多個(gè)項(xiàng)。但是，如果是在單選選擇框中，修改某個(gè)選項(xiàng)的 selected 屬性則會(huì)取消對(duì)其他選項(xiàng)的選擇。需要注意的是，將 selected 屬性設(shè)置為 false 對(duì)單選選擇框沒(méi)有影響</p>
<p>1420、 contenteditable 屬性應(yīng)用給頁(yè)面中的任何元素，然后用戶立即就可以編輯該元素。document.body.contentEditable="true"</p>
<b>第十五章 使用canvas繪圖</b>
<b>第十六章 HTML5腳本編程</b>
<b>第十七章 錯(cuò)誤處理與調(diào)試</b>
<p>1701、在 IE7 及更早版本中，如果錯(cuò)誤發(fā)生在位于外部文件的腳本中，行號(hào)通常會(huì)與錯(cuò)誤所在的行號(hào)差 1。如果是嵌入在頁(yè)面中的腳本發(fā)生錯(cuò)誤，則行號(hào)就是錯(cuò)誤所在的行號(hào)</p>
<p>1702、ECMA-262 第 3 版引入了 try-catch 語(yǔ)句，作為 JavaScript 中處理異常的一種標(biāo)準(zhǔn)方式。也就是說(shuō)，我們應(yīng)該把所有可能會(huì)拋出錯(cuò)誤的代碼都放在 try 語(yǔ)句塊中，而把那些用于錯(cuò)誤處理的代碼放在 catch 塊中。如果 try 塊中的任何代碼發(fā)生了錯(cuò)誤，就會(huì)立即退出代碼執(zhí)行過(guò)程，然后接著執(zhí)行 catch 塊。此時(shí)， catch 塊會(huì)接收到一個(gè)包含錯(cuò)誤信息的對(duì)象。與在其他語(yǔ)言中不同的是，即使你不想使用這個(gè)錯(cuò)誤對(duì)象，也要給它起個(gè)名字。這個(gè)對(duì)象中包含的實(shí)際信息會(huì)因?yàn)g覽器而異，但共同的是有一個(gè)保存著錯(cuò)誤消息的 message 屬性。ECMA-262 還規(guī)定了一個(gè)保存錯(cuò)誤類(lèi)型的 name 屬性；當(dāng)前所有瀏覽器都支持這個(gè)屬性（Opera 9 之前的版本不支持這個(gè)屬性）。因此，在發(fā)生錯(cuò)誤時(shí)，就可以像下面這樣實(shí)事求是地顯示瀏覽器給出的消息</p>
<p>1703、只要代碼中包含 finally 子句，那么無(wú)論 try 還是 catch 語(yǔ)句塊中的 return 語(yǔ)句都將被忽略。因此，在使用 finally 子句之前，一定要非常清楚你想讓代碼怎么樣</p>
<p>1704、TypeError 類(lèi)型在 JavaScript 中會(huì)經(jīng)常用到，在變量中保存著意外的類(lèi)型時(shí)，或者在訪問(wèn)不存在的方法時(shí)，都會(huì)導(dǎo)致這種錯(cuò)誤。錯(cuò)誤的原因雖然多種多樣，但歸根結(jié)底還是由于在執(zhí)行特定于類(lèi)型的操作時(shí)，變量的類(lèi)型并不符合要求所致</p>
<p>1705、使用 try-catch 最適合處理那些我們無(wú)法控制的錯(cuò)誤。假設(shè)你在使用一個(gè)大型 JavaScript 庫(kù)中的函數(shù)，該函數(shù)可能會(huì)有意無(wú)意地拋出一些錯(cuò)誤。由于我們不能修改這個(gè)庫(kù)的源代碼，所以大可將對(duì)該函數(shù)的調(diào)用放在 try-catch 語(yǔ)句當(dāng)中，萬(wàn)一有什么錯(cuò)誤發(fā)生，也好恰當(dāng)?shù)靥幚硭鼈?/p>
<p>1706、在遇到 throw 操作符時(shí)，代碼會(huì)立即停止執(zhí)行。僅當(dāng)有 try-catch 語(yǔ)句捕獲到被拋出的值時(shí)，代碼才會(huì)繼續(xù)執(zhí)行</p>
<p>437、利用原型鏈還可以通過(guò)繼承 Error 來(lái)創(chuàng)建自定義
</div>
<div id="6a22guqa" class="mt-64 tags-seach" >
<div id="6a22guqa" class="tags-info">
<a style="width:120px;" title="云服務(wù)器" href="http://m.hztianpu.com/site/active/kuaijiesale.html?ytag=seo">云服務(wù)器</a>
<a style="width:120px;" title="GPU云服務(wù)器" href="http://m.hztianpu.com/site/product/gpu.html">GPU云服務(wù)器</a>
<a style="width:120px;" title="javascript高級(jí)程序設(shè)計(jì)第三版" href="http://m.hztianpu.com/yun/tag/javascriptgaojichengxushejidisanban/">javascript高級(jí)程序設(shè)計(jì)第三版</a>
<a style="width:120px;" title="javascript第三版" href="http://m.hztianpu.com/yun/tag/javascriptdisanban/">javascript第三版</a>
<a style="width:120px;" title="c語(yǔ)言程序設(shè)計(jì)第三版" href="http://m.hztianpu.com/yun/tag/cyuyanchengxushejidisanban/">c語(yǔ)言程序設(shè)計(jì)第三版</a>
<a style="width:120px;" title="匯編語(yǔ)言程序設(shè)計(jì)第三版" href="http://m.hztianpu.com/yun/tag/huibianyuyanchengxushejidisanban/">匯編語(yǔ)言程序設(shè)計(jì)第三版</a>
</div>
</div>
<div id="6a22guqa" class="entry-copyright mb-30">
<p class="mb-15"> 文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。</p>
<p>轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/107738.html</p>
</div>
<ul class="pre-next-page">
<li id="6a22guqa" class="ellipsis"><a class="hpf" href="http://m.hztianpu.com/yun/107737.html">上一篇：antd源碼解讀（二）Tooltip組件解析</a></li>
<li id="6a22guqa" class="ellipsis"><a class="hpf" href="http://m.hztianpu.com/yun/107739.html">下一篇：javascript高級(jí)程序設(shè)計(jì)（第三版）學(xué)習(xí)摘錄上</a></li>
</ul>
</div>
<div id="6a22guqa" class="about_topicone-mid">
<h3 class="top-com-title mb-0"><span data-id="0">相關(guān)文章</span></h3>
<ul class="com_white-left-mid atricle-list-box">
<li>
<div id="6a22guqa" class="atricle-list-right">
<h2 class="ellipsis2"><a class="hpf" href="http://m.hztianpu.com/yun/107739.html"><b><em>javascript</em><em>高級(jí)</em><em><em>程序</em><em>設(shè)計(jì)</em></em>（<em>第<em>三版</em></em>）<em>學(xué)習(xí)</em><em>摘錄</em>上</b></a></h2>
<p class="ellipsis2 good">摘要：在這種情況下，函數(shù)在停止執(zhí)行后將返回值。這種用法一般用在需要提前停止函數(shù)執(zhí)行而又不需要返回值的情況下嚴(yán)格模式對(duì)函數(shù)有一些限制不能把函數(shù)命名為或不能把參數(shù)命名為或不能出現(xiàn)兩個(gè)命名參數(shù)同名的情況。
把近期看高程這本書(shū)做的筆記摘錄整理出來(lái)了，總歸對(duì)原生javascript理論有了一個(gè)比較全面的的認(rèn)識(shí)，這次把書(shū)中的一些知識(shí)要點(diǎn)摘錄出來(lái)了，便于以后查閱的時(shí)候有方向，也更有效率??！
第一章、jav...</p>
<div id="6a22guqa" class="com_white-left-info">
<div id="6a22guqa" class="com_white-left-infol">
<a href="http://m.hztianpu.com/yun/u-1102.html"><img src="http://m.hztianpu.com/yun/data/avatar/000/00/11/small_000001102.jpg" alt=""><span id="6a22guqa" class="layui-hide64">leap_frog</span></a>
<time datetime="">2019-08-26 11:52</time>
<span><i class="fa fa-commenting"></i>評(píng)論0</span>
<span><i class="fa fa-star"></i>收藏0</span>
</div>
</div>
</div>
</li>
<li>
<div id="6a22guqa" class="atricle-list-right">
<h2 class="ellipsis2"><a class="hpf" href="http://m.hztianpu.com/yun/89720.html"><b>《<em>Javascript</em><em>高級(jí)</em><em><em>程序</em><em>設(shè)計(jì)</em></em> (<em>第<em>三版</em></em>)》第五章 引用類(lèi)型</b></a></h2>
<p class="ellipsis2 good">摘要：類(lèi)型沒(méi)有重載聲明了兩個(gè)同名函數(shù)，而結(jié)果則是后面的函數(shù)覆蓋了前面的函數(shù)。引用的是函數(shù)據(jù)以執(zhí)行的環(huán)境對(duì)象函數(shù)屬性和方法表示函數(shù)希望接收的命名參數(shù)的個(gè)數(shù)。而自動(dòng)創(chuàng)建的基本包裝類(lèi)型的對(duì)象，則只存在于一行代碼的執(zhí)行瞬間，然后立即被銷(xiāo)毀。
Function類(lèi)型
沒(méi)有重載
聲明了兩個(gè)同名函數(shù)，而結(jié)果則是后面的函數(shù)覆蓋了前面的函數(shù)。
var addSomeNumber = function (num)...</p>
<div id="6a22guqa" class="com_white-left-info">
<div id="6a22guqa" class="com_white-left-infol">
<a href="http://m.hztianpu.com/yun/u-526.html"><img src="http://m.hztianpu.com/yun/data/avatar/000/00/05/small_000000526.jpg" alt=""><span id="6a22guqa" class="layui-hide64">GeekGhc</span></a>
<time datetime="">2019-08-21 17:35</time>
<span><i class="fa fa-commenting"></i>評(píng)論0</span>
<span><i class="fa fa-star"></i>收藏0</span>
</div>
</div>
</div>
</li>
<li>
<div id="6a22guqa" class="atricle-list-right">
<h2 class="ellipsis2"><a class="hpf" href="http://m.hztianpu.com/yun/89519.html"><b>《<em>Javascript</em><em>高級(jí)</em><em><em>程序</em><em>設(shè)計(jì)</em></em> (<em>第<em>三版</em></em>)》<em>第三</em>章 基本概念</b></a></h2>
<p class="ellipsis2 good">摘要：如在上列中結(jié)果實(shí)際上是給定數(shù)字的字符串形式無(wú)效語(yǔ)法有效語(yǔ)法在上列中結(jié)果是因?yàn)榈谝粋€(gè)被視為的一部分，第二個(gè)是屬性訪問(wèn)運(yùn)算符。用于檢查傳入的對(duì)象是否是傳入對(duì)象的原型第章將討論原型。返回對(duì)象的字符串表示。
只挑本人重要的寫(xiě)(有夾雜其他補(bǔ)充)
3.1 語(yǔ)法
注釋
單行注釋以兩個(gè)斜杠開(kāi)頭，如下所示：
// 單行注釋
塊級(jí)注釋以一個(gè)斜杠和一個(gè)星號(hào)（ /* ）開(kāi)頭，
以一個(gè)星號(hào)和...</p>
<div id="6a22guqa" class="com_white-left-info">
<div id="6a22guqa" class="com_white-left-infol">
<a href="http://m.hztianpu.com/yun/u-1332.html"><img src="http://m.hztianpu.com/yun/data/avatar/000/00/13/small_000001332.jpg" alt=""><span id="6a22guqa" class="layui-hide64">caige</span></a>
<time datetime="">2019-08-21 17:26</time>
<span><i class="fa fa-commenting"></i>評(píng)論0</span>
<span><i class="fa fa-star"></i>收藏0</span>
</div>
</div>
</div>
</li>
<li>
<div id="6a22guqa" class="atricle-list-right">
<h2 class="ellipsis2"><a class="hpf" href="http://m.hztianpu.com/yun/114009.html"><b><em>JavaScript</em> <em>高級(jí)</em><em><em>程序</em><em>設(shè)計(jì)</em></em>（<em>第<em>三版</em></em>）筆記</b></a></h2>
<p class="ellipsis2 good">摘要：以上是使用轉(zhuǎn)換函數(shù)方法時(shí)會(huì)返回的值在用判斷的時(shí)候，首先執(zhí)行了，然后判斷為真或假。對(duì)象的遍歷返回一個(gè)數(shù)組，包括對(duì)象自身的不含繼承的所有可枚舉屬性不含屬性的鍵名。
tip：本文含部分Es6語(yǔ)法
1.if(a)的自動(dòng)轉(zhuǎn)換
數(shù)據(jù)類(lèi)型??? 轉(zhuǎn)換為true的值??? ?? 轉(zhuǎn)換為false的值
? Boolean ?? ? true??????????? ? false
??String? 任何...</p>
<div id="6a22guqa" class="com_white-left-info">
<div id="6a22guqa" class="com_white-left-infol">
<a href="http://m.hztianpu.com/yun/u-679.html"><img src="http://m.hztianpu.com/yun/data/avatar/000/00/06/small_000000679.jpg" alt=""><span id="6a22guqa" class="layui-hide64">tulayang</span></a>
<time datetime="">2019-08-29 16:57</time>
<span><i class="fa fa-commenting"></i>評(píng)論0</span>
<span><i class="fa fa-star"></i>收藏0</span>
</div>
</div>
</div>
</li>
<li>
<div id="6a22guqa" class="atricle-list-right">
<h2 class="ellipsis2"><a class="hpf" href="http://m.hztianpu.com/yun/53051.html"><b><em>JavaScript</em> <em>高級(jí)</em><em><em>程序</em><em>設(shè)計(jì)</em></em>（<em>第<em>三版</em></em>）筆記</b></a></h2>
<p class="ellipsis2 good">摘要：以上是使用轉(zhuǎn)換函數(shù)方法時(shí)會(huì)返回的值在用判斷的時(shí)候，首先執(zhí)行了，然后判斷為真或假。對(duì)象的遍歷返回一個(gè)數(shù)組，包括對(duì)象自身的不含繼承的所有可枚舉屬性不含屬性的鍵名。
tip：本文含部分Es6語(yǔ)法
1.if(a)的自動(dòng)轉(zhuǎn)換
數(shù)據(jù)類(lèi)型??? 轉(zhuǎn)換為true的值??? ?? 轉(zhuǎn)換為false的值
? Boolean ?? ? true??????????? ? false
??String? 任何...</p>
<div id="6a22guqa" class="com_white-left-info">
<div id="6a22guqa" class="com_white-left-infol">
<a href="http://m.hztianpu.com/yun/u-544.html"><img src="http://m.hztianpu.com/yun/data/avatar/000/00/05/small_000000544.jpg" alt=""><span id="6a22guqa" class="layui-hide64">leo108</span></a>
<time datetime="">2019-08-02 11:41</time>
<span><i class="fa fa-commenting"></i>評(píng)論0</span>
<span><i class="fa fa-star"></i>收藏0</span>
</div>
</div>
</div>
</li>
</ul>
</div>
<div id="6a22guqa" class="topicone-box-wangeditor">
<h3 class="top-com-title mb-64"><span>發(fā)表評(píng)論</span></h3>
<div id="6a22guqa" class="xcp-publish-main flex_box_zd">
<div id="6a22guqa" class="unlogin-pinglun-box">
<a href="javascript:login()" class="grad">登陸后可評(píng)論</a>
</div> </div>
</div>
<div id="6a22guqa" class="site-box-content">
<div id="6a22guqa" class="site-content-title">
<h3 class="top-com-title mb-64"><span>0條評(píng)論</span></h3>
</div>
<div id="6a22guqa" class="pages"></ul></div>
</div>
</div>
<div id="6a22guqa" class="layui-col-md4 layui-col-lg3 com_white-right site-wrap-right">
<div id="6a22guqa" class="">
<div id="6a22guqa" class="com_layuiright-box user-msgbox">
<a href="http://m.hztianpu.com/yun/u-241.html"><img src="http://m.hztianpu.com/yun/data/avatar/000/00/02/small_000000241.jpg" alt=""></a>
<h3><a href="http://m.hztianpu.com/yun/u-241.html" rel="nofollow">yiliang</a></h3>
<h6>男<span>|</span>高級(jí)講師</h6>
<div id="6a22guqa" class="flex_box_zd user-msgbox-atten">
<a href="javascript:attentto_user(241)" id="attenttouser_241" class="grad follow-btn notfollow attention">我要關(guān)注</a>
<a href="javascript:login()" title="發(fā)私信" >我要私信</a>
</div>
<div id="6a22guqa" class="user-msgbox-list flex_box_zd">
<h3 class="hpf">TA的文章</h3>
<a href="http://m.hztianpu.com/yun/ut-241.html" class="box_hxjz">閱讀更多</a>
</div>
<ul class="user-msgbox-ul">
<li><h3 class="ellipsis"><a href="http://m.hztianpu.com/yun/123642.html">『學(xué)了就忘』Linux軟件包管理 — 45、yum源文件詳細(xì)說(shuō)明</a></h3>
<p>閱讀 2725<span>·</span>2021-11-17 17:00</p></li>
<li><h3 class="ellipsis"><a href="http://m.hztianpu.com/yun/122101.html">Vue devtools工具安裝 Chrome安裝Vue devtools 教程步驟</a></h3>
<p>閱讀 2016<span>·</span>2021-10-11 10:57</p></li>
<li><h3 class="ellipsis"><a href="http://m.hztianpu.com/yun/119703.html">ReliableSite：美國(guó)服務(wù)器租用(紐約/邁阿密/洛杉磯);E5-1650v3/128GB/2</a></h3>
<p>閱讀 3847<span>·</span>2021-09-09 11:33</p></li>
<li><h3 class="ellipsis"><a href="http://m.hztianpu.com/yun/119658.html">一篇文章帶你了解如何用Planting 為測(cè)試工程師開(kāi)發(fā)的部署框架</a></h3>
<p>閱讀 1042<span>·</span>2021-09-09 09:33</p></li>
<li><h3 class="ellipsis"><a href="http://m.hztianpu.com/yun/115947.html">BFC深入理解</a></h3>
<p>閱讀 3618<span>·</span>2019-08-30 14:20</p></li>
<li><h3 class="ellipsis"><a href="http://m.hztianpu.com/yun/111639.html">好用的sublime text 插件(有空的時(shí)候持續(xù)更新)</a></h3>
<p>閱讀 3425<span>·</span>2019-08-29 11:25</p></li>
<li><h3 class="ellipsis"><a href="http://m.hztianpu.com/yun/109571.html">nginx 常用命令</a></h3>
<p>閱讀 2875<span>·</span>2019-08-26 13:48</p></li>
<li><h3 class="ellipsis"><a href="http://m.hztianpu.com/yun/107738.html">javascript高級(jí)程序設(shè)計(jì)（第三版）學(xué)習(xí)摘錄下</a></h3>
<p>閱讀 819<span>·</span>2019-08-26 11:52</p></li>
</ul>
</div>
<!-- 文章詳情右側(cè)廣告-->
<div id="6a22guqa" class="com_layuiright-box">
<h6 class="top-com-title"><span>最新活動(dòng)</span></h6>
<div id="6a22guqa" class="com_adbox">
<div id="6a22guqa" class="layui-carousel" id="right-item">
<div carousel-item>
<div>
<a href="http://m.hztianpu.com/site/active/kuaijiesale.html?ytag=seo" rel="nofollow">
<img src="http://m.hztianpu.com/yun/data/attach/240625/2rTjEHmi.png" alt="云服務(wù)器">
</a>
</div>
<div>
<a href="http://m.hztianpu.com/site/product/gpu.html" rel="nofollow">
<img src="http://m.hztianpu.com/yun/data/attach/240807/7NjZjdrd.png" alt="GPU云服務(wù)器">
</a>
</div>
</div>
</div>
</div> <!-- banner結(jié)束 -->
<div id="6a22guqa" class="adhtml">
</div>
</div> </div>
</div>
</div>
</div>
</section>
<!-- wap拉出按鈕 -->
<div id="6a22guqa" class="site-tree-mobile layui-hide">
<i class="layui-icon layui-icon-spread-left"></i>
</div>
<!-- wap遮罩層 -->
<div id="6a22guqa" class="site-mobile-shade"></div>
<!--付費(fèi)閱讀 -->
<div class="6a22guqa" id="payread">
<div id="6a22guqa" class="layui-form-item">閱讀需要支付1元查看</div>
<div id="6a22guqa" class="layui-form-item"><button class="btn-right">支付并查看</button></div>
</div>
<link rel="stylesheet" type="text/css" href="http://m.hztianpu.com/yun/static/js/neweditor/code/styles/tomorrow-night-eighties.css">
<footer>
<div id="6a22guqa" class="layui-container">
<div id="6a22guqa" class="flex_box_zd">
<div id="6a22guqa" class="left-footer">
<h6><a href="http://m.hztianpu.com/"><img src="http://m.hztianpu.com/yun/static/theme/ukd//images/logo.png" alt="UCloud （優(yōu)刻得科技股份有限公司）"></a></h6>
<p>UCloud （優(yōu)刻得科技股份有限公司）是中立、安全的云計(jì)算服務(wù)平臺(tái)，堅(jiān)持中立，不涉足客戶業(yè)務(wù)領(lǐng)域。公司自主研發(fā)IaaS、PaaS、大數(shù)據(jù)流通平臺(tái)、AI服務(wù)平臺(tái)等一系列云計(jì)算產(chǎn)品，并深入了解互聯(lián)網(wǎng)、傳統(tǒng)企業(yè)在不同場(chǎng)景下的業(yè)務(wù)需求，提供公有云、混合云、私有云、專(zhuān)有云在內(nèi)的綜合性行業(yè)解決方案。</p>
</div>
<div id="6a22guqa" class="right-footer layui-hidemd">
<ul class="flex_box_zd">
<li>
<h6>UCloud與云服務(wù)</h6>
<p><a href="http://m.hztianpu.com/site/about/intro/">公司介紹</a></p>
<p><a >加入我們</a></p>
<p><a href="http://m.hztianpu.com/site/ucan/onlineclass/">UCan線上公開(kāi)課</a></p>
<p><a href="http://m.hztianpu.com/site/solutions.html" >行業(yè)解決方案</a></p> <p><a href="http://m.hztianpu.com/site/pro-notice/">產(chǎn)品動(dòng)態(tài)</a></p>
</li>
<li>
<h6>友情鏈接</h6> <p><a >GPU算力平臺(tái)</a></p> <p><a >UCloud私有云</a></p>
<p><a >SurferCloud</a></p> <p><a >工廠仿真軟件</a></p> <p><a >AI繪畫(huà)</a></p>
<p><a >Wavespeed AI</a></p>
</li>
<li>
<h6>社區(qū)欄目</h6>
<p><a href="http://m.hztianpu.com/yun/column/index.html">專(zhuān)欄文章</a></p>
<p><a href="http://m.hztianpu.com/yun/udata/">專(zhuān)題地圖</a></p> </li>
<li>
<h6>常見(jiàn)問(wèn)題</h6>
<p><a href="http://m.hztianpu.com/site/ucsafe/notice.html" >安全中心</a></p>
<p><a href="http://m.hztianpu.com/site/about/news/recent/" >新聞動(dòng)態(tài)</a></p>
<p><a href="http://m.hztianpu.com/site/about/news/report/">媒體動(dòng)態(tài)</a></p> <p><a href="http://m.hztianpu.com/site/cases.html">客戶案例</a></p>
<p><a href="http://m.hztianpu.com/site/notice/">公告</a></p>
</li>
<li>
<span><img src="https://static.ucloud.cn/7a4b6983f4b94bcb97380adc5d073865.png" alt="優(yōu)刻得"></span>
<p>掃掃了解更多</p></div>
</div>
<div id="6a22guqa" class="copyright">Copyright ? 2012-2025 UCloud 優(yōu)刻得科技股份有限公司<i>｜</i><a rel="nofollow" >滬公網(wǎng)安備 31011002000058號(hào)</a><i>｜</i><a rel="nofollow" ></a> 滬ICP備12020087號(hào)-3</a><i>｜</i>
<!-- Global site tag (gtag.js) - Google Analytics -->
</div>
</div>
</footer>
<footer>
<div class="friendship-link">
<p>感谢您访问我们的网站，您可能还对以下资源感兴趣：</p>
<h1><a href="http://m.hztianpu.com/">成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码</a></h1>
<div class="friend-links">
</div>
</div>
</footer>
<script>
(function(){
var bp = document.createElement('script');
var curProtocol = window.location.protocol.split(':')[0];
if (curProtocol === 'https') {
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
}
else {
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
}
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bp, s);
})();
</script>
</body><div id="lrtz5" class="pl_css_ganrao" style="display: none;"><pre id="lrtz5"><track id="lrtz5"></track></pre><output id="lrtz5"><sub id="lrtz5"><strike id="lrtz5"><label id="lrtz5"></label></strike></sub></output><span id="lrtz5"><strike id="lrtz5"><strong id="lrtz5"><optgroup id="lrtz5"></optgroup></strong></strike></span><small id="lrtz5"><menuitem id="lrtz5"></menuitem></small><th id="lrtz5"><b id="lrtz5"><mark id="lrtz5"><form id="lrtz5"></form></mark></b></th><legend id="lrtz5"></legend><label id="lrtz5"><optgroup id="lrtz5"><output id="lrtz5"><sub id="lrtz5"></sub></output></optgroup></label><div id="lrtz5"><sup id="lrtz5"></sup></div><tt id="lrtz5"></tt><strong id="lrtz5"><track id="lrtz5"></track></strong><ol id="lrtz5"><label id="lrtz5"></label></ol><p id="lrtz5"></p><small id="lrtz5"></small><mark id="lrtz5"><form id="lrtz5"><p id="lrtz5"><dfn id="lrtz5"></dfn></p></form></mark><address id="lrtz5"><legend id="lrtz5"><dfn id="lrtz5"><u id="lrtz5"></u></dfn></legend></address><dfn id="lrtz5"><output id="lrtz5"><span id="lrtz5"><strike id="lrtz5"></strike></span></output></dfn><strong id="lrtz5"><ruby id="lrtz5"><thead id="lrtz5"><strike id="lrtz5"></strike></thead></ruby></strong><thead id="lrtz5"><label id="lrtz5"><strong id="lrtz5"><track id="lrtz5"></track></strong></label></thead><sub id="lrtz5"><thead id="lrtz5"><strong id="lrtz5"><optgroup id="lrtz5"></optgroup></strong></thead></sub><sup id="lrtz5"></sup><i id="lrtz5"></i><label id="lrtz5"><video id="lrtz5"></video></label><sub id="lrtz5"><thead id="lrtz5"><nobr id="lrtz5"><small id="lrtz5"></small></nobr></thead></sub><ruby id="lrtz5"><thead id="lrtz5"></thead></ruby><strike id="lrtz5"><strong id="lrtz5"><dfn id="lrtz5"><output id="lrtz5"></output></dfn></strong></strike><output id="lrtz5"></output><b id="lrtz5"><progress id="lrtz5"></progress></b><legend id="lrtz5"><dfn id="lrtz5"><b id="lrtz5"><mark id="lrtz5"></mark></b></dfn></legend><ol id="lrtz5"><label id="lrtz5"><video id="lrtz5"><em id="lrtz5"></em></video></label></ol><track id="lrtz5"><thead id="lrtz5"><big id="lrtz5"><dl id="lrtz5"></dl></big></thead></track><dfn id="lrtz5"><b id="lrtz5"></b></dfn><progress id="lrtz5"><acronym id="lrtz5"></acronym></progress><legend id="lrtz5"><sup id="lrtz5"></sup></legend><nobr id="lrtz5"><small id="lrtz5"></small></nobr><mark id="lrtz5"><form id="lrtz5"></form></mark><ruby id="lrtz5"><thead id="lrtz5"><big id="lrtz5"><dl id="lrtz5"></dl></big></thead></ruby><legend id="lrtz5"><dfn id="lrtz5"></dfn></legend><rp id="lrtz5"><font id="lrtz5"></font></rp><nobr id="lrtz5"><em id="lrtz5"></em></nobr><u id="lrtz5"><rp id="lrtz5"><address id="lrtz5"><legend id="lrtz5"></legend></address></rp></u><small id="lrtz5"></small><style id="lrtz5"><video id="lrtz5"></video></style><menuitem id="lrtz5"><sub id="lrtz5"><thead id="lrtz5"><label id="lrtz5"></label></thead></sub></menuitem><dfn id="lrtz5"><output id="lrtz5"><span id="lrtz5"><strike id="lrtz5"></strike></span></output></dfn><strong id="lrtz5"></strong><dfn id="lrtz5"></dfn><ruby id="lrtz5"></ruby><var id="lrtz5"><u id="lrtz5"><ins id="lrtz5"><address id="lrtz5"></address></ins></u></var><strong id="lrtz5"><optgroup id="lrtz5"><menuitem id="lrtz5"><span id="lrtz5"></span></menuitem></optgroup></strong><small id="lrtz5"><menuitem id="lrtz5"><ol id="lrtz5"><style id="lrtz5"></style></ol></menuitem></small><progress id="lrtz5"></progress><thead id="lrtz5"><strong id="lrtz5"></strong></thead><meter id="lrtz5"><ol id="lrtz5"></ol></meter><rp id="lrtz5"><font id="lrtz5"></font></rp><legend id="lrtz5"></legend><form id="lrtz5"></form><dfn id="lrtz5"><output id="lrtz5"><sub id="lrtz5"><thead id="lrtz5"></thead></sub></output></dfn><video id="lrtz5"><font id="lrtz5"><div id="lrtz5"><ol id="lrtz5"></ol></div></font></video><b id="lrtz5"><progress id="lrtz5"></progress></b><label id="lrtz5"></label><thead id="lrtz5"><thead id="lrtz5"></thead></thead><rp id="lrtz5"></rp><big id="lrtz5"><dl id="lrtz5"></dl></big><th id="lrtz5"></th><sub id="lrtz5"></sub><listing id="lrtz5"></listing><strike id="lrtz5"><listing id="lrtz5"></listing></strike><dfn id="lrtz5"><b id="lrtz5"></b></dfn><label id="lrtz5"><video id="lrtz5"></video></label><nobr id="lrtz5"></nobr><b id="lrtz5"></b><span id="lrtz5"><strike id="lrtz5"><strong id="lrtz5"><dfn id="lrtz5"></dfn></strong></strike></span><nobr id="lrtz5"></nobr><ol id="lrtz5"></ol><meter id="lrtz5"><span id="lrtz5"></span></meter><label id="lrtz5"><video id="lrtz5"></video></label><pre id="lrtz5"></pre><i id="lrtz5"><nobr id="lrtz5"></nobr></i><ins id="lrtz5"><font id="lrtz5"><div id="lrtz5"><ol id="lrtz5"></ol></div></font></ins><u id="lrtz5"></u><menuitem id="lrtz5"><span id="lrtz5"><strike id="lrtz5"><listing id="lrtz5"></listing></strike></span></menuitem><dfn id="lrtz5"><b id="lrtz5"></b></dfn><nobr id="lrtz5"></nobr><p id="lrtz5"><var id="lrtz5"></var></p><th id="lrtz5"><b id="lrtz5"><mark id="lrtz5"><acronym id="lrtz5"></acronym></mark></b></th><dl id="lrtz5"><strong id="lrtz5"></strong></dl><acronym id="lrtz5"><legend id="lrtz5"><dfn id="lrtz5"><u id="lrtz5"></u></dfn></legend></acronym><dfn id="lrtz5"><u id="lrtz5"></u></dfn><acronym id="lrtz5"><legend id="lrtz5"><dfn id="lrtz5"><u id="lrtz5"></u></dfn></legend></acronym><address id="lrtz5"><p id="lrtz5"><sup id="lrtz5"><form id="lrtz5"></form></sup></p></address><optgroup id="lrtz5"><ruby id="lrtz5"></ruby></optgroup><rp id="lrtz5"><font id="lrtz5"></font></rp><strong id="lrtz5"><track id="lrtz5"></track></strong><label id="lrtz5"><video id="lrtz5"></video></label><style id="lrtz5"><nobr id="lrtz5"></nobr></style><strong id="lrtz5"><ruby id="lrtz5"></ruby></strong><address id="lrtz5"><p id="lrtz5"></p></address><style id="lrtz5"></style><pre id="lrtz5"></pre><u id="lrtz5"><rp id="lrtz5"><address id="lrtz5"><legend id="lrtz5"></legend></address></rp></u><ruby id="lrtz5"><thead id="lrtz5"></thead></ruby><track id="lrtz5"><tt id="lrtz5"><progress id="lrtz5"><dl id="lrtz5"></dl></progress></tt></track><listing id="lrtz5"><dfn id="lrtz5"></dfn></listing><u id="lrtz5"></u><label id="lrtz5"><video id="lrtz5"></video></label><legend id="lrtz5"></legend><sup id="lrtz5"></sup><small id="lrtz5"><output id="lrtz5"></output></small><th id="lrtz5"></th><strong id="lrtz5"></strong><p id="lrtz5"><var id="lrtz5"></var></p><sup id="lrtz5"></sup><em id="lrtz5"><meter id="lrtz5"><pre id="lrtz5"><style id="lrtz5"></style></pre></meter></em><th id="lrtz5"><u id="lrtz5"><mark id="lrtz5"><form id="lrtz5"></form></mark></u></th><span id="lrtz5"><strike id="lrtz5"><strong id="lrtz5"><optgroup id="lrtz5"></optgroup></strong></strike></span><ruby id="lrtz5"><sub id="lrtz5"></sub></ruby><ruby id="lrtz5"><thead id="lrtz5"><big id="lrtz5"><dl id="lrtz5"></dl></big></thead></ruby><listing id="lrtz5"><optgroup id="lrtz5"><output id="lrtz5"><sub id="lrtz5"></sub></output></optgroup></listing><listing id="lrtz5"><small id="lrtz5"><meter id="lrtz5"><ol id="lrtz5"></ol></meter></small></listing><track id="lrtz5"><b id="lrtz5"></b></track><address id="lrtz5"><p id="lrtz5"></p></address><label id="lrtz5"><video id="lrtz5"></video></label><ruby id="lrtz5"><thead id="lrtz5"></thead></ruby><strong id="lrtz5"><track id="lrtz5"></track></strong><mark id="lrtz5"><form id="lrtz5"><p id="lrtz5"><dfn id="lrtz5"></dfn></p></form></mark><form id="lrtz5"></form><menuitem id="lrtz5"><pre id="lrtz5"><style id="lrtz5"><nobr id="lrtz5"></nobr></style></pre></menuitem><font id="lrtz5"><div id="lrtz5"><ol id="lrtz5"><label id="lrtz5"></label></ol></div></font><progress id="lrtz5"><dl id="lrtz5"></dl></progress><sub id="lrtz5"><strike id="lrtz5"></strike></sub><mark id="lrtz5"><form id="lrtz5"><p id="lrtz5"><var id="lrtz5"></var></p></form></mark><strong id="lrtz5"><small id="lrtz5"><menuitem id="lrtz5"><span id="lrtz5"></span></menuitem></small></strong><sub id="lrtz5"></sub><strong id="lrtz5"></strong><rp id="lrtz5"><font id="lrtz5"><div id="lrtz5"><sup id="lrtz5"></sup></div></font></rp><tt id="lrtz5"></tt><i id="lrtz5"><listing id="lrtz5"><dfn id="lrtz5"><menuitem id="lrtz5"></menuitem></dfn></listing></i><ins id="lrtz5"></ins><small id="lrtz5"><menuitem id="lrtz5"></menuitem></small><thead id="lrtz5"></thead><i id="lrtz5"><listing id="lrtz5"><small id="lrtz5"><menuitem id="lrtz5"></menuitem></small></listing></i><listing id="lrtz5"><dfn id="lrtz5"><output id="lrtz5"><sub id="lrtz5"></sub></output></dfn></listing><legend id="lrtz5"><ol id="lrtz5"><style id="lrtz5"><video id="lrtz5"></video></style></ol></legend><label id="lrtz5"><rp id="lrtz5"><address id="lrtz5"><legend id="lrtz5"></legend></address></rp></label><label id="lrtz5"></label><p id="lrtz5"><var id="lrtz5"><u id="lrtz5"><progress id="lrtz5"></progress></u></var></p><small id="lrtz5"></small><b id="lrtz5"><mark id="lrtz5"><acronym id="lrtz5"><pre id="lrtz5"></pre></acronym></mark></b><b id="lrtz5"><progress id="lrtz5"></progress></b><form id="lrtz5"></form></div>
<
</html> 