了解jQuery的detach()和remove()
jQuery中提供了两种移出一个DOM元素的方法detach()和remove(),虽然是一样的功能，但是给出两种方法，必然有它的不同之处。
empty() 单独说一下 ，它删除当前元素的所有子元素，包括文本节点，并不会删除当前元素的事件和样式，删除之后不可恢复。
官方解释：
detach() 方法移除被选元素，包括所有文本和子节点。detach() 会保留所有绑定的事件、附加的数据
remove() 方法是移出元素，包括绑定的事件，附加数据
代码分析
当使用的是 detach方法时，重新添加元素之后点击事件依然有效
当使用的是remove方法时，重新添加元素之后点击事件不生效
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script src="js/jquery-1.7.2.min.js"></script> 7 <script> 8 $(document).ready(function(){ 9 var $div1 = $('.div1') 10 // 绑定事件 11 $('.div1').click(function(){ 12 alert(1) 13 }) 14 // 删除元素 15 $('#detach').click(function(){ 16 $div1.detach(); 17 }) 18 //重新添加 19 $('#back').click(function(){ 20 $('#box').append($div1) 21 }) 22 }) 23 </script> 24 </head> 25 <body> 26 <div id="box"> 27 <div class="div1">aaaaaa</div> 28 <div class="div2"">bbbbbb</div> 29 </div> 30 <input type="button" value="detach" id="detach"> 31 <input type="button" value="back" id="back"> 32 </body> 33 </html>
