當頁面加載時，瀏覽器會創建頁面的文檔對象模型（Document Object Model）。文檔對象模型定義訪問和處理HTML文檔的標準方法。DOM 將HTML文檔呈現為帶有元素、屬性和文本的樹結構，即節點樹。通過DOM，JS可創建動態的HTML，可以使網頁顯示動態效果并實現與用戶的交互功能。JS能夠改變頁面中所有的HTML元素、屬性和CSS樣式，并對頁面中所有事件做出響應。所以學習JS的起點就是處理網頁，處理網頁就需要使用DOM進行操作。
2、DOM獲取元素。
JS要想操作HTML元素，那么首先就必須先找到該元素。通常使用以下幾種方法完成：
通過元素設置的id找到HTML元素。
通過標簽名找到HTML元素。
通過元素設置的名稱(name)找到HTML元素。
所謂的DOM，實際上就是document，獲取元素就是操作document。
(1)、通過id找到元素
方法：document.getElementById('id');
網頁是由標簽將信息組合起來的，id屬性值是唯一的，就像身份證一樣，通過一個身份證可以找到相對應的人，所以通過該方法，可以獲取到與之相對應的標簽，而獲取的元素在JS中是一個對象，若想對元素進行操作，則需要通過他的屬性或方法。
(2)、通過標簽名找到元素
方法：document.getElementsByTagName('Tagname');
通過該方法，返回的是帶有指定標簽名的對象的集合，也就是以數組的形式返回，返回的順序是他們在文檔中的順序。
(3)、通過name找到元素
方法：document.getElementsByName('name');
該方法與getElementById()方法有點相似，都是通過設置的屬性值找到元素，只不過該方法是通過設置的name屬性值查找元素。name屬性在文檔中可能不唯一，所以該方法返回的也是元素的數組，而不是一個元素。
HTML文檔可以說是由節點構成的集合，常見的DOM節點有三種，即元素節點、屬性節點和文本節點。元素節點就是HTML標簽，標簽的屬性就是屬性節點，文本節點就是頁面可以瀏覽的內容。
在文檔對象模型中，每一個節點都是一個對象，DOM節點有三個重要的屬性：節點的名稱，節點的值和節點的類型。
(1)、nodeName：節點的名稱
nodeName屬性返回節點的名稱。元素節點的名稱與標簽名相同(大寫)，屬性節點的名稱是屬性的名稱，文本節點的名稱永遠都是#text，文檔節點的名稱永遠都是#document。
(2)、nodeValue：節點的值
nodeValue屬性返回節點的值。元素節點的值是undegined或null，屬性節點的值是屬性的值，文本節點的值是文本自身。
(3)、nodeType：節點的類型
nodeType屬性返回節點的類型。以下是常見的節點類型：
聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
JavaScriptDOM學習總結(五)_javascript技巧
JavaScriptDOM學習總結(五)_javascript技巧:1、DOM簡介。 當頁面加載時，瀏覽器會創建頁面的文檔對象模型（Document Object Model）。文檔對象模型定義訪問和處理HTML文檔的標準方法。DOM 將HTML文檔呈現為帶有元素、屬性和文本的樹結構，即節點樹。通過DOM，JS可創建動態的HTML，可以使網頁顯示推薦度：
- 熱門焦點
Copyright ? 2019-2025 51dongshi.com 版權所有
違法及侵權請聯系：TEL:177 7030 7066 E-MAIL:11247931@qq.com 本站由北京市萬商天勤律師事務所王興未律師提供法律服務
