HTML DOM那点儿事儿
定義了訪問和操作HTML文檔的標(biāo)準(zhǔn)方法。
HTML DOM 把 HTML 文檔呈現(xiàn)為帶有元素、屬性和文本的樹結(jié)構(gòu)(節(jié)點(diǎn)樹)。
HTML網(wǎng)頁Node節(jié)點(diǎn)樹:
?
從整個(gè)HTML網(wǎng)頁節(jié)點(diǎn)樹圖中我們可以清楚的看到元素之間的父子關(guān)系,途中元素<head>與元素<body>為同級(jí)元素,屬性href也是元素<a>的一部分;該樹中大部分元素都有子節(jié)點(diǎn),而大部分元素也都有父輩,其中我們可以吧<html>元素看作所有節(jié)點(diǎn)的先輩。
?????? 下面我們共同來學(xué)習(xí)通過DOM來訪問Document的標(biāo)簽元素:
??????
首先,我們來使用使用
getElementById() 和 getElementsByTagName(“標(biāo)簽名”) 方法來訪問;getElementById()是通過ID屬性來訪問該標(biāo)簽元素,getElementsByTagName()會(huì)返回一個(gè)節(jié)點(diǎn)列表。
這三個(gè)屬性
parentNode、firstChild 以及
lastChild 可遵循文檔的結(jié)構(gòu),尋找節(jié)點(diǎn)的父節(jié)點(diǎn)、第一個(gè)子節(jié)點(diǎn)、最后一個(gè)子節(jié)點(diǎn),document.documentElement ,
document.body這兩個(gè)屬性可以分別對(duì)文檔的根節(jié)點(diǎn)與body標(biāo)簽進(jìn)行直接的訪問。
??????
接著我們對(duì)元素的屬性進(jìn)行獲得:
1.元素節(jié)點(diǎn)的 nodeName
是標(biāo)簽名稱
2.屬性節(jié)點(diǎn)的 nodeName
是屬性名稱
3.文本節(jié)點(diǎn)的 nodeName
永遠(yuǎn)是 #text
4.文檔節(jié)點(diǎn)的 nodeName
永遠(yuǎn)是 #document
這里注意nodeName返回的標(biāo)簽名稱總是大寫的英文字母。
nodeValue:
??????
對(duì)于文本節(jié)點(diǎn)而言,nodeValue屬性是其包含的文本
??????
而對(duì)于屬性節(jié)點(diǎn)來說,包含的是屬性值
??????
文檔節(jié)點(diǎn)與元素節(jié)點(diǎn)是沒有nodeValue屬性的
nodeType 節(jié)點(diǎn)的重要類型分為5種:
??????
以下以:元素類型---節(jié)點(diǎn)類型這種表現(xiàn)形式表現(xiàn)出這5種類型
??????
元素---1
??????
屬性---2
??????
文本---3
??????
注釋---8
??????
文檔---9
以上就是HTML
DOM的基礎(chǔ)知識(shí),關(guān)于HTML DOM的應(yīng)用個(gè)人有以下幾點(diǎn)建議:
1.JS與HTML的基礎(chǔ)要扎實(shí)
2.應(yīng)當(dāng)對(duì)DOM的節(jié)點(diǎn)樹結(jié)構(gòu)進(jìn)行理解,這點(diǎn)比較重要
3.對(duì)方法與屬性的運(yùn)用正確且書寫格式規(guī)范
簡(jiǎn)單的一些HTML
DOM跟大家分享一下,以下附件連接地址為HTML
DOM的練習(xí)實(shí)例,也希望大家有好的知識(shí)拿出來分享下。
3G鋪?zhàn)?#xff1a;
http://www.3gput.com/forum.php?mod=viewthread&tid=193
PS:請(qǐng)復(fù)制到你的IE地址欄進(jìn)行訪問
轉(zhuǎn)載于:https://www.cnblogs.com/H_Razor/archive/2011/03/17/1986645.html
總結(jié)
以上是生活随笔為你收集整理的HTML DOM那点儿事儿的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 131125 - 关于对“一次元”、“二
- 下一篇: asp.net mvc的初学