欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Javascript入門學(xué)習(xí)第六篇 js DOM編程第1/2頁

 更新時間:2008年07月06日 10:01:30   作者:  
上篇文章納悶的問題,將在這章和以后的幾章里,慢慢搞定。 從今天起,開始學(xué)習(xí)DOM編程 讓我們慢慢稱為一名初級的js程序員。 然后往js匠人方向發(fā)展。

學(xué)習(xí)英文:
Dom:文檔對象模型。Document object model
Bom:瀏覽器對象模型。
注:也可以叫窗口對象模型。(window object model.)
API:應(yīng)用編程接口。
注:DOM其實可以看作一種API。
Node:節(jié)點。
注:節(jié)點分為:元素節(jié)點,屬性節(jié)點,文本節(jié)點。
元素節(jié)點 包含 屬性節(jié)點和文本節(jié)點。

Dom樹:



下面我們直接看 到底怎么操作DOM。
1,    創(chuàng)建元素節(jié)點。createElement():
<SCRIPT LANGUAGE="JavaScript">
 var a  = document.createElement("p");
 alert( "節(jié)點類型是  : " +a.nodeType   +  " , 節(jié)點名稱是: "  +  a.nodeName);
</SCRIPT>
輸出  ;     nodeType 是  1   .    a.nodeName 是  p ;
所以它創(chuàng)建的是一個元素節(jié)點 ….你也許會想  為什么文檔中沒發(fā)現(xiàn) 節(jié)點 p呢?
我們看下面例子:
<body>
</body>
<SCRIPT LANGUAGE="JavaScript">
var a  = document.createElement("p");
document.body.appendChild(a);
</SCRIPT>
用firebug查看下,發(fā)現(xiàn)文檔中已經(jīng) 有我們需要的結(jié)果了。


原來createElement()方法創(chuàng)建出來的新元素節(jié)點不會被自動添加到文檔里,既然沒添加到文檔里,說明它還是一個游離的狀態(tài)。如果想把它添加到文檔里,可以使用 appendChild()或者insertBefore()方法或者replaceChild()方法(后面介紹)。 

2,創(chuàng)建文本節(jié)點。createTextNode():
var b = document.createTextNode("my demo");
 alert( "節(jié)點類型是  : " +b.nodeType   +  " , 節(jié)點名稱是: "  +  b.nodeName);
輸出  ;     nodeType 是  3   .    a.nodeName 是  #text ;
所以它創(chuàng)建的是一個文本節(jié)點 ….你也許又會想  為什么文檔中沒發(fā)現(xiàn) 這個文本節(jié)點 呢?難道也和createElement()一樣,需要使用appendChild()添加到文檔里。

對的,你的想法非常對。
我們看下面例子:
<body>
</body>
<SCRIPT LANGUAGE="JavaScript">
var mes = document.createTextNode("hello world");
var container = document.createElement("p");
container.appendChild(mes);//先把文本節(jié)點添加到 元素節(jié)點
document.body.appendChild(container);//再把元素節(jié)點添加到 文檔里
</SCRIPT>

3,    復(fù)制節(jié)點。cloneNode(boolean) :一個參數(shù):
看一個例子:
<body>
</body>
<SCRIPT LANGUAGE="JavaScript">
var mes = document.createTextNode("hello world");
var container = document.createElement("p");
container.appendChild(mes);
document.body.appendChild(container);
var newpara = container.cloneNode(true);//true和false的區(qū)別
document.body.appendChild(newpara );

var newpara = container.cloneNode(false);//true和false的區(qū)別
document.body.appendChild(newpara );
</SCRIPT>
看下firebug下的結(jié)果: 

相關(guān)文章

最新評論