详解框架中的清空、移除和派遣

通过一张对比表来解释几个方法之间的不同

三者都有把元素移除的作用，但细微的差别，造就了它们的使命不同。

最权威的解释当然是jQuery_API咯，下面是应用程序接口中关于他三儿的部分截取。

一、空：

此方法不仅移除子（和其他后代)元素，还移除匹配元素集中的任何文本。这是因为，根据数字正射影像图规范，元素中的任何文本字符串都被视为该元素的子节点。为了避免内存泄漏，jQuery会在移除元素本身之前，从子元素中移除其他结构，例如数据和事件处理程序。如果希望在不破坏元素的数据或事件处理程序的情况下移除元素（以便以后可以重新添加),请使用。请改为分离()。

注意：加粗的部分，通过空的移除后代元素，会移除其事件的。

为什么呢？

防止内存泄露！

二移除：

类似于。空(),则移除()方法从数字正射影像图中取出元素。使用。当您想要移除元素本身以及其中的所有内容时，请移除()。除了元素本身，所有绑定的事件和与元素相关联的框架数据都会被移除。若要移除元素而不移除数据和事件，请使用。请改为分离()。

移动和空的方法一样，都会移除元素的事件句柄，从而避免内存泄露。

区别：移除包含了移除事件本身，而空的是后代元素。

三、detach:

从空的和移动的介绍中（英文斜体部分),可以或多或少得知，分离是不会移除事件句柄的。

那么我们再来看看详细的应用程序接口讲解：

那个分离()方法与相同。移除(),除此之外分离()保留所有与移除的元素相关联的框架数据。当移除的元素稍后要重新插入到数字正射影像图中时，此方法很有用。

咦，什么意思？

看了派遣的注解，不知道大家有没有眼前一亮，分离不能用来删除废弃的元素。

为什么呢？

因为它保留了事件驱动嘛，这样不就会造成内存泄露么。

所以要删除以后不再利用的元素时，使用空的或者移除。

那要派遣有何用？

用处大了。

当我们要对一个元素进行大规模的增删改的时候，我们可以用派遣将这个元素提取出来，然后在这个元素上进行操作，而不是在整个数字正射影像图文档中进行操作。

好处就是：减少对整个数字正射影像图文档的修改，从而减少页面重绘；而且对整个数字正射影像图文档进行操作，在工程师协会下还可能会造成内存泄露哦。所以稳妥起见，还是利用派遣这一神器吧。

下面是一个演示，首先对#集装箱元素绑定点击事件（事件委托),然后利用派遣将其脱离文档，然后再创建两个儿童元素，追加到#集装箱元素中，最后将#集装箱重新添加到身体后。

！DOCTYPE html标题jquery/title meta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8'/stylediv.monkey，# container { width:120px高度：120 px线高：60 px}div.monkey {border:1px纯黑；}/style/head dydiv class=' monkey '/div div id=' container '/div script src=' http : jquery-1。12 .0 .js//script script $(function(){//事件代理$(“# container”).on('click ')，function(event){ console。日志($(事件。目标).text())；});//利用派遣将容器从数字正射影像图文档中剥离开定义变量容器=$(“# container”).分离();var child 1=' divI am Monkey/div '；var child2='divMonkey是me/div '；//将儿童1、儿童2插入容器中$(集装箱)。追加（子1)。追加(儿童2名)；//将容器重新插入身体中$(“正文”).追加（容器);});/脚本/正文/html以上所述是小编给大家介绍的框架中的清空、移除和派遣的区别，希望对大家有所帮助！