思洋互动网站建设学前班

内容添加（3）

（4）jQuery函数insertBefore()--外部插入元素内容

该函数把所有匹配的元素插入到另一个指定的元素集合的前面。其语法形式如下：

1. insertBefore(content) 

 

可以将上面的代码修改如下：

1. 1 <script type="text/javascript"> 
2. 2   $(function(){  
3. 3       $("#append").click(function(){  
4. 4           $("<p>"+$("#txt").val()+"</p>").insertAfter($("#div1").             children());        //在div1的子元素后插入文本框内容  
5. 5       });  
6. 6       $("#prepend").click(function(){  
7. 7           $("<p>"+$("#txt").val()+"</p>").insertBefore($("#div1").                children());        //在div1的子元素前插入文本框内容  
8. 8       });  
9. 9   });  
10. 10</script> 

 

效果如图3.25和图3.26所示。

图3.25  DIV利用外部插入添加内容一

图3.26  DIV利用外部插入添加内容二