思洋互动网站建设学前班

DIV内的内容控制

对于DIV的内容控制介绍如下几种操作：内容清空、内容替换、内容复制、内容添加、内容包装等。这些操作都涉及jQuery的文档处理方法。

3.4.1  内容清空

首先来介绍DIV中的内容清空。在jQuery的文档操作中具有清空文档子内容的方法empty()。这里可以利用它来完成内容清空。

该函数删除匹配的元素集合中所有的子节点。其语法形式如下：

 

1. empty() 

 

HTML代码和CSS样式参考光盘内容。下面直接看一下JavaScript功能实现：

1. 1 <script type="text/javascript"> 
2. 2   $(function(){  
3. 3       $("#update").click(function(){  
4. 4           $("#div1").empty();     //清空元素内容  
5. 5       });  
6. 6   });  
7. 7 </script> 

 

当单击页面上的按钮时，jQuery就会清空DIV下所有的子内容，效果如图3.18和图3.19所示。

图3.18  DIV原有内容

图3.19  清空DIV内容