資源描述:
《JS操作DOM元素屬性和方法》由會(huì)員上傳分享,免費(fèi)在線閱讀,更多相關(guān)內(nèi)容在教育資源-天天文庫(kù)。
1、JS操作DOM元素屬性和方法Dom元素基本操作方法API,先記錄下,方便以后使用?! 3CDOM和JavaScript很容易混淆不清。DOM是面向HTML和XML文檔的API,為文檔提供了結(jié)構(gòu)化表示,并定義了如何通過腳本來(lái)訪問文檔結(jié)構(gòu)。JavaScript則是用于訪問和處理DOM的語(yǔ)言。如果沒有DOM,JavaScript根本沒有Web頁(yè)面和構(gòu)成頁(yè)面元素的概念。文檔中的每個(gè)元素都是DOM的一部分,這就使得JavaScript可以訪問元素的屬性和方法?! OM獨(dú)立于具體的編程語(yǔ)言,通常通過JavaScript訪問DOM,不過并不嚴(yán)格要求這樣??梢允褂萌魏文_本語(yǔ)言來(lái)
2、訪問DOM,這要?dú)w功于其一致的API。表3-1列出了DOM元素的一些有用的屬性,表3-2列出了一些有用的方法。表3-1 用于處理XML文檔的DOM元素屬性屬性名???????描述childNodes返回當(dāng)前元素所有子元素的數(shù)組firstChild返回當(dāng)前元素的第一個(gè)下級(jí)子元素lastChild返回當(dāng)前元素的最后一個(gè)子元素nextSibling返回緊跟在當(dāng)前元素后面的元素nodeValue指定表示元素值的讀/寫屬性parentNode返回元素的父節(jié)點(diǎn)previousSibling返回緊鄰當(dāng)前元素之前的元素表3-2 用于遍歷XML文檔的DOM元素方法方法名???????
3、????????????????描述getElementById(id)(document)獲取有指定惟一ID屬性值文檔中的元素getElementsByTagName(name)返回當(dāng)前元素中有指定標(biāo)記名的子元素的數(shù)組hasChildNodes()返回一個(gè)布爾值,指示元素是否有子元素getAttribute(name)返回元素的屬性值,屬性由name指定 有了W3CDOM,就能編寫簡(jiǎn)單的跨瀏覽器腳本,從而充分利用XML的強(qiáng)大功能和靈活性,將XML作為瀏覽器和服務(wù)器之間的通信介質(zhì)?! 南旅娴睦涌梢钥吹?,使用遵循W3CDOM的JavaScript來(lái)讀取XML文檔
4、是何等簡(jiǎn)單。代碼清單3-3顯示了服務(wù)器向?yàn)g覽器返回的XML文檔的內(nèi)容。這是一個(gè)簡(jiǎn)單的美國(guó)州名列表,各個(gè)州按地區(qū)劃分。表3-3動(dòng)態(tài)創(chuàng)建內(nèi)容時(shí)所用的W3CDOM屬性和方法屬性/方法????????????????描述document.createElement(tagName)文檔對(duì)象上的createElement方法可以創(chuàng)建由tagName指定的元素。如果以串div作為方法參數(shù),就會(huì)生成一個(gè)div元素document.createTextNode(text)文檔對(duì)象的createTextNode方法會(huì)創(chuàng)建一個(gè)包含靜態(tài)文本的節(jié)點(diǎn).appendChild
5、(childNode)appendChild方法將指定的節(jié)點(diǎn)增加到當(dāng)前元素的子節(jié)點(diǎn)列表(作為一個(gè)新的子節(jié)點(diǎn))。例如,可以增加一個(gè)option元素,作為select元素的子節(jié)點(diǎn).getAttribute(name).setAttribute(name,value)這些方法分別獲得和設(shè)置元素中name屬性的值.insertBefore(newNode,targetNode)將節(jié)點(diǎn)newNode作為當(dāng)前元素的子節(jié)點(diǎn)插到targetNode元素前面.removeAttribute(name)這個(gè)方法從元
6、素中刪除屬性name.removeChild(childNode)這個(gè)方法從元素中刪除子元素childNode.replaceChild(newNode,oldNode)這個(gè)方法將節(jié)點(diǎn)oldNode替換為節(jié)點(diǎn)newNode.hasChildnodes()這個(gè)方法返回一個(gè)布爾值,指示元素是否有子元素Document--最頂層的節(jié)點(diǎn),所有的其他節(jié)點(diǎn)都是附屬于它的。DocumentType--DTD引用(使用語(yǔ)法)的對(duì)象表現(xiàn)形式,它不能包含子節(jié)點(diǎn)。DocumentFragment--可以像Docum
7、ent一樣來(lái)保存其他節(jié)點(diǎn)。Element--表示起始標(biāo)簽和結(jié)束標(biāo)簽之間的內(nèi)容,例如或者。這是唯一可以同時(shí)包含特性和子節(jié)點(diǎn)的節(jié)點(diǎn)類型。Attr--代表一對(duì)特性名和特性值。這個(gè)節(jié)點(diǎn)類型不能包含子節(jié)點(diǎn)。Text--代表XML文檔中的在起始標(biāo)簽和結(jié)束標(biāo)簽之間,或者CDataSection內(nèi)包含的普通文本。這個(gè)節(jié)點(diǎn)類型不能包含子節(jié)點(diǎn)。CDataSection--的對(duì)象表現(xiàn)形式。這個(gè)節(jié)點(diǎn)類型僅能包含文本節(jié)點(diǎn)Text作為子節(jié)點(diǎn)。Entity--表示在DTD中的一個(gè)實(shí)體定義,例如。這個(gè)節(jié)