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