亚洲欧美成人久久综合中文网,久久久久久无码Av成人影院,yellow中文字幕久久网

JS(02)-DOM介紹

理論知識(shí)：
介紹一下DOM，所謂的DOM用英文來說就是DOCUMENT OBJECT MODEL，即文檔-對(duì)象-模型。什么意思呢。其實(shí)每一個(gè)網(wǎng)頁(yè)，就是一份HTML文檔，而HTML文檔是可以看成一棵樹的，這棵樹稱為節(jié)點(diǎn)樹，顧名思義，它是由節(jié)點(diǎn)（Node）構(gòu)成的。
而每一個(gè)節(jié)點(diǎn)其實(shí)對(duì)應(yīng)的又是一個(gè)對(duì)象，既然是對(duì)象，就可以擁有屬性，擁有方法。在進(jìn)一步想，在編程中，創(chuàng)建對(duì)象要分配內(nèi)存，所以一份HTML文檔，其背后是瀏覽器創(chuàng)建了一個(gè)DOM的節(jié)點(diǎn)樹，這些節(jié)點(diǎn)的關(guān)系通過指針實(shí)現(xiàn)，而每個(gè)節(jié)點(diǎn)即每個(gè)對(duì)象
在內(nèi)存中都占有一定空間。
一顆節(jié)點(diǎn)樹：

所以我要介紹下什么是節(jié)點(diǎn)：
先來看下這張圖：

Node是一個(gè)類，代表著節(jié)點(diǎn)類，其下有Document類，Element類。這兩個(gè)類是學(xué)習(xí)DOM的重點(diǎn)。
1.Document類代在瀏覽器中有個(gè)Document對(duì)象，就是document，它是全局性的。如果你看第一張圖，
會(huì)發(fā)現(xiàn)，document在整個(gè)文檔的根節(jié)點(diǎn)，。
2.Element類，代表的是元素節(jié)點(diǎn)，元素節(jié)點(diǎn)包括HTML元素節(jié)點(diǎn)中所有的元素都是元素節(jié)點(diǎn)。
3.Document于Element中的HTMLDocument、HTMLElement是不一樣的，Document和Element代表的是HTML/XML
文檔，而Element代表的是這些文檔的元素，而HTMLDocument、HTMLElement是進(jìn)一步的細(xì)分，他們代表的是
HTML文檔。

重點(diǎn)知識(shí)：
前面介紹的理論知識(shí)是為了這步做鋪墊的，我們通過上面可以知道，其實(shí)HTML文檔相當(dāng)于一份初始配置文檔，當(dāng)?shù)谝淮渭虞d時(shí)，瀏覽器把它創(chuàng)建為DOM節(jié)點(diǎn)樹保存在內(nèi)存中，而這以后顯示在瀏覽器上的東西，都是通過讀取DOM節(jié)點(diǎn)樹來實(shí)現(xiàn)的。
所以我們就要學(xué)習(xí)DOM節(jié)點(diǎn)樹提供給我們定位，獲取節(jié)點(diǎn)的接口，主要是通過Document對(duì)象的實(shí)例document中的三個(gè)方法。為什么是document對(duì)象呢？因?yàn)樽鳛橐豢脴洌歉?jié)點(diǎn)，通過根節(jié)點(diǎn)我們可以搜索到所有節(jié)點(diǎn)（學(xué)過數(shù)據(jù)結(jié)構(gòu)的
應(yīng)該很容易理解）。
1.所以我們通過document中提供的三個(gè)方法：getElementById("XXX");getElementsByTag("XXX");getElementsByClassName("XXX");最后一個(gè)是HTML5中新提供的接口。前面兩個(gè)，分別是通過Id屬性，和標(biāo)簽獲取
指定的元素或者元素集合。
2.既然獲得了節(jié)點(diǎn)，我們可以通過節(jié)點(diǎn)這個(gè)對(duì)象所提供的方法來操作節(jié)點(diǎn)，說得形象點(diǎn)，我們獲取節(jié)點(diǎn)后，可以和節(jié)點(diǎn)對(duì)話，我們可以向節(jié)點(diǎn)發(fā)送消息，而消息會(huì)激發(fā)節(jié)點(diǎn)對(duì)象相應(yīng)的動(dòng)作，具體的，我們可以發(fā)送getAttribute("XXX");消息來獲取節(jié)點(diǎn)對(duì)象屬性的值
我們還可以發(fā)送消息setAttribute(key,value);來設(shè)置指定節(jié)點(diǎn)屬性為key的值為value。

2014.07.09
03：43
于福州

posted on 2014-07-09 03:33 swp 閱讀(169) 評(píng)論(0) 編輯收藏引用所屬分類: Web

只有注冊(cè)用戶登錄后才能發(fā)表評(píng)論。
【推薦】100%開源！大型工業(yè)跨平臺(tái)軟件C++源碼提供，建模，組態(tài)！

相關(guān)文章: JS(04)圖片庫(kù)改進(jìn)之書寫優(yōu)秀的JS-DOM JS(03) Node節(jié)點(diǎn)屬性和事件之圖片庫(kù) JS(02)-DOM介紹 JS(01)-JavaScript語(yǔ)法 (SQL總結(jié)精華)sixleaves之mysql之表的連接詳細(xì)總結(jié)

網(wǎng)站導(dǎo)航: 博客園 IT新聞 BlogJava 博問 Chat2DB 管理

f(sixleaves) = sixleaves

常用鏈接

留言簿

隨筆分類(117)

隨筆檔案(95)

搜索

積分與排名

最新評(píng)論

閱讀排行榜

評(píng)論排行榜