JavaScript學習8:DOM進階__Java

來源:互聯網
上載者:User

        DOM自身存在很多類型,我們在上篇部落格中提到了大部分的類型,比如Element類型:表示的是元素節點,比如Text類型:表示的是文本節點。DOM也提供了一些擴充功能。

        一.DOM類型

        上篇部落格我們瞭解了DOM的節點以及怎樣操作和查詢節點,而本身這些不同的節點,又有著不同的類型

        

        我們隨便來看兩個類型:Document類型和Element類型

        Document類型表示文檔,或文檔的根節點,而這個節點時隱藏的,沒有具體的元素標籤。

        Element類型用於表現HTML中的元素節點。在之前的文章裡,我們  已經可以對元素節點進行尋找、建立等操作,元素節點的nodeType為1,nodeName為元素的標籤名。

        元素節點對象在非IE瀏覽器可以返回它具體元素節點的物件類型。

        二.DOM擴充

        1 呈現模式

        從IE6開始區分標準模式和混雜模式(怪異模式),主要是看文檔的聲明。IE為Document對象添加了一個名為compatMode屬性,這個屬性可以識別IE瀏覽器的文檔處於什麼模式。如果是標準模式,則返回CSS1Compat,如果是混雜模式則返回BackCompat。

        2 滾動

        DOM提供了一些滾動頁面的方法,如下:

        Document.getElementById(‘box’).scrollIntoView();

        3 children屬性

        由於子節點空白問題,IE和其他瀏覽器解釋不一樣。雖然可以過濾掉,但是如果得到有效子節點,可以使用children屬性,支援的瀏覽器為:IE5+,Firefox3.5+等等。

        4 contains()方法

        判斷一個節點是不是另一個節點的後代,我們可以使用contains()方法。這個方法是IE率先使用的,開發人員無須遍曆即可擷取此資訊。

        三.DOM操作內容

        1 innerText屬性

       除了Firefox之外,其他瀏覽器均支援這個方法。但是Firefox的DOM3級提供了另一個類似的屬性:textContent,做上相容即可通用。

        2innerHTML 屬性

        這個屬性我們之前介紹過,不拒絕HTML。雖然可以插入HTML,但是還是有一些限制的,也就是所謂的範圍元素,離開這個範圍就無效了。

        3outerText

        outerText在取值的時候和innerText一樣,Firefox同樣不支援,而賦值方法相當危險,他不單替換了常值內容,還將元素直接抹去。

        4outerHTML

        這個使用和innerHTML一樣,同樣在賦值的時候要謹慎。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.