思洋互动网站建设学前班

生成与操作Node

◆createAttribute(name) ：创建一个名为name的属性节点。

◆createCDATASection(text) ：创建一个子节点为text的CDATA区。

◆createComment(text) ：创建一个注释内容为text的注释节点。

◆createDocumentFragment() ：创建一个文档片断（fragment）节点。

◆createElement(tagName) ：创建一个名为tagName的元素节点。

◆createTextNode(text) ：创建一个包含text的文本节点。
广州网站建设,网站建设,广州网页设计,广州网站设计

其中最重要的方法是createElement(),createDocumentFragment(), create TextNode()。

1. /*使用createElement(),createTextNode(),appendChild()动态添加节点*/    
2. function createMessage(){     
3.  var op = document.createElement("p");     
4.  var oText = document.createTextNode("hello world!");     
5.  op.appendChild(oText);     
6.  document.body.appendChild(op);     
7. }    
8. /*使用createElement(),createTextNode(),appendChild()动态添加节点*/  
9. function createMessage(){  
10.  var op = document.createElement("p");  
11.  var oText = document.createTextNode("hello world!");  
12.  op.appendChild(oText);  
13.  document.body.appendChild(op);  
14. } 

使用createDocumentFragment()：

1. //通常做法     
2. var arrText = ['first', 'second', 'third'];     
3. for(var i=0; i<arrText.length; i++){     
4.     var op = document.createElement('p');     
5.     var oText = document.createTextNode(arrText[i]);     
6.     op.appendChild(oText);     
7.     document.body.appendChild(op);     
8. }     
9. //使用documentFragment     
10. var arrText = ['first', 'second', 'third'];     
11. var oFragment = document.createDocumentFragment();     
12. for(var i=0; i<arrText.length; i++){     
13.     var op = document.createElement('p');     
14.     var oText = document.createTextNode(arrText[i]);     
15.     op.appendChild(oText);     
16.     oFragment.appendChild(op);     
17. }     
18. document.body.appendChild(oFragment);    
19. //通常做法  
20. var arrText = ['first', 'second', 'third'];  
21. for(var i=0; i<arrText.length; i++){  
22.  var op = document.createElement('p');  
23.  var oText = document.createTextNode(arrText[i]);  
24.  op.appendChild(oText);  
25.  document.body.appendChild(op);  
26. }  
27. //使用documentFragment  
28. var arrText = ['first', 'second', 'third'];  
29. var oFragment = document.createDocumentFragment();  
30. for(var i=0; i<arrText.length; i++){  
31.  var op = document.createElement('p');  
32.  var oText = document.createTextNode(arrText[i]);  
33.  op.appendChild(oText);  
34.  oFragment.appendChild(op);  
35. }  
36. document.body.appendChild(oFragment);   

通过DocumentFragment的方式效率更高。
广州网站建设,网站建设,广州网页设计,广州网站设计

HTML DOM

使用DOM的核心方法是针对所有XML的，针对HTML DOM有特殊的方法，如：

◆使用DOM core：oImg.setAttribute("src", "picture.gif");

◆使用HTML DOM：oImg.src = "picture.jpg";