大主宰,古风名字,辰东

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營(yíng)銷(xiāo)解決方案

JavaScriptDOM基礎(chǔ)操作實(shí)例

文檔對(duì)象模型(Document Object Model)，通常簡(jiǎn)稱(chēng)為DOM，是網(wǎng)站內(nèi)容與JavaScript互通的接口。自JavaScript成為最常用的語(yǔ)言時(shí)JavaScript和DOM通常被視為獨(dú)立的實(shí)體。DOM接口用于存取、遍歷和控制HTML和XML文檔。下面我們將簡(jiǎn)單的介紹一些JavaScript DOM的基本操作實(shí)例，包括建立、增加、刪除、克隆、訪問(wèn)節(jié)點(diǎn)等等。

創(chuàng)新互聯(lián)主要從事網(wǎng)站設(shè)計(jì)制作、成都網(wǎng)站設(shè)計(jì)、網(wǎng)頁(yè)設(shè)計(jì)、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)老邊,十年網(wǎng)站建設(shè)經(jīng)驗(yàn),價(jià)格優(yōu)惠、服務(wù)專(zhuān)業(yè),歡迎來(lái)電咨詢建站服務(wù):18982081108

推薦閱讀：JavaScript DOM的本質(zhì)及操作方法

1. getElementById(id)

這是通過(guò)id來(lái)訪問(wèn)某一元素，最常用的之一，例：

alert(document.getElementById("myid").innerHTML);

注意點(diǎn)：如果元素的ID不是***，則會(huì)取得***個(gè)該ID名稱(chēng)的元素。

2. getElementsByName(name)

這是通過(guò)name來(lái)取得某一堆元素（作為數(shù)組），看 Element后面有個(gè)小s就知道了，ID是HTML文檔中要求***的，name可以不是***，如checkbox、radio等地方會(huì)用到多個(gè) input用同一個(gè)name來(lái)識(shí)別是否為同黨。對(duì)了，getElementsByName(name)僅用于取得input、radio、 checkbox等元素，如。

3. getElementsByTagName(tagname)

看這方法就知道這也是取得某一堆元素（作為數(shù)組），是通過(guò)TagName也就是標(biāo)簽名來(lái)取得。你可以遍歷這個(gè)數(shù)組獲得每一個(gè)單獨(dú)的元素。當(dāng)一個(gè)DOM結(jié)構(gòu)很大時(shí)，可以通過(guò)它來(lái)有效地縮小搜查范圍。

4. appendChild(node)

向當(dāng)前的元素（應(yīng)該叫對(duì)象比較恰當(dāng)）追加節(jié)點(diǎn)。

var newdiv=document.createElement("div")

var newtext=document.createTextNode("A new div")

newdiv.appendChild(newtext)

document.getElementById("test").appendChild(newdiv)

剛才我在***個(gè)例子中為了顯示出內(nèi)容，用了innerHTML，剛才看到文章才得知innerHTMl不屬于DOM。

5. removeChild(childreference)

刪除當(dāng)前節(jié)點(diǎn)的子節(jié)點(diǎn)，返回被刪除的節(jié)點(diǎn)。這個(gè)被刪除的節(jié)點(diǎn)可以被插入到別的地方。

var childnode=document.getElementById("child")

var removednode=document.getElementById("parent").removeChild(childnode)

6. cloneNode(deepBoolean)

復(fù)制并返回當(dāng)前節(jié)點(diǎn)的復(fù)制節(jié)點(diǎn)，復(fù)制節(jié)點(diǎn)是一個(gè)孤立節(jié)點(diǎn)，它復(fù)制了原節(jié)點(diǎn)的屬性，在把這個(gè)新節(jié)點(diǎn)加入到document前，根據(jù)需要修改ID屬性確保其ID的***。這個(gè)方法支持一個(gè)布爾參數(shù)，當(dāng)deepBoolean設(shè)置true時(shí)，復(fù)制當(dāng)前節(jié)點(diǎn)的所有子節(jié)點(diǎn)，包括該節(jié)點(diǎn)內(nèi)的文本。

 
 
 
  
  
  
  
  
           
  
  
           test
  
  
           
  
  
           p=document.getElementById("mynode")  
  
  
          ppclone = p.cloneNode(true); 
  
  
           p.parentNode.appendChild(pclone);

7. replaceChild(newChild, oldChild)

把當(dāng)前節(jié)點(diǎn)的一個(gè)子節(jié)點(diǎn)換成另一個(gè)節(jié)點(diǎn)。

var orinode=document.getElementById("orispan");

var newnode=document.createElement("p");

var text=document.createTextNode("test ppp ");

newnode.appendChild(text);

document.getElementById("mynode2").replaceChild(newnode, orinode);

本文標(biāo)題：JavaScriptDOM基礎(chǔ)操作實(shí)例
網(wǎng)頁(yè)路徑：http://m.fisionsoft.com.cn/article/dpispps.html

新聞中心

其他資訊