javascript节点的汇总

1 有时候在页面中有个div标签 但是我想在div标签后插入多个标签 那么正常的情况下 是不能一次性插入的 比如说在div标签后 这样插入肯定不行的 div.appendChild(div1,div2,div3);这样是不行的 但是我们可以写个简单的函数来一次性添加多个元素：

1. function append(node){ 
2.    for(var i=1;i<arguments.length;i++){ 
3.         node.appendChild(arguments[i]); 
4.     } 
5. return node; 
6. } 
7. 调用的方式如下: 
8. append(document.body,div1,div2,div3); 

上面的简单的函数就可以在body里面一次性加入多个元素标签。上面的arguments是每个函数都有的 就是保存函数中的所有变量 类似于数组 但是不是数组 .

2 我们都知道DOM节点有appendChild removeChild insertBefor replaceChild等待方法 当然一次性删除多个子节点的方法 函数也和上面的类似；

1. function delNode(){  
2.   for(var i=0;i<arguments.length;i++){  
3.            arguments[i].parentNode.removeChlid(arguments[i]); 
4.         }  
5.     } 
6. 调用方式如下: delNode(div1,div2,div3) ; 

3 有insertBefore这个方法 但是怎么没有insertAfter方法呢 没有关系 我们可以简单的写个函数 简单的分析下：

加入页面有两个标签：<div id="tugenhua"></div><div id="bozhu"></div>

那么如果我想在tugenhua的后面插入个div标签的话 那该怎么办呢！我们都知道在tugenhua后面插入个div标签 也意味着在bozhu前面插入一个是一样的道理！这是第一点 第二点要判断的是 那么如果tugenhau后面没有兄弟节点的话  也就是说tugenhua是最后一个标签的话 那么我想在tugenhua这个ID后面插入一个标签的话 可以在此父元素后面追加一个元素就可以了！原理就上面两点！总结下 1 在一个标签的后面插入一个标签的话 也就意味在此标签的下个兄弟节点前面插入一个元素标签  2 如果此标签没有下个兄弟节点的话 也就是说 他是文档最后一个节点话 那么我可以转到父类 然后再父类最后添加一个标签！下面函数如下：

1. <div id="op" class="op"></div> 
2.     <p></p> 
3. <script> 
4.     var div1 = document.createElement("div"); 
5.     var op = document.getElementById("op"); 
6.         function insertAfter(node,newNode){ 
7.             //如果当前的 节点 有下个兄弟节点的话  那么让他插入到下个兄弟节点的前面去 
8.             //如果当前的节点没有下个兄弟节点 那么让他先到父节点 父节点再最后增加一个子节点 
9.             var pn = op.parentNode; 
10.             if(node.nextSibling){ 
11.                 pn.insertBefore(newNode,node.nextSibling);   
12.             }else{ 
13.                 pn.appendChild(newNode); 
14.             } 
15.             return newNode; 
16.         } 
17.         insertAfter(op,div1); 
18. </script>