.detach()就是从DOM中删除所有匹配的元素。

与.remove()方法不同的是, 这个方法不会把匹配的元素从jQuery对象中删除,所有绑定的事件、附加的数据等都会保留下来,因而可以在将来再使用这些匹配的元素。

只是有个小地方需要注意下:

<ul class="level-1">
<li class="item-b">B
<ul class="level-3">
<li class="item-1">1</li>
</ul>
</li>
</ul>
<div id='content'>content</div>

现在先把.level-3删除掉,然后再append到#content里,如果写成这样:

$('ul').detach(".level-3");
$('#content').append($(".level-3"));

上面这样是没有效果的,得下面这样:

var a=$('ul').detach(".level-3");
$('#content').append(a);

其实上面这样依然不对,最后#content节点结构是:

<div id="content">content
<ul class="level-1">
<li class="item-b">B
</li>
</ul>
<ul class="level-3">
<li class="item-1">1</li>
</ul>
</div>

改成下面这样就可以了。

var a=$('.level-3').detach();
$('#content').append(a);

jquery的.detach()方法的更多相关文章

  1. jquery之remove(),detach()方法详解

    一:remove()方法 remove()函数用于从文档中移除匹配的元素. 你还可以使用选择器进一步缩小移除的范围,只移除当前匹配元素中符合指定选择器的部分元素. 与detach()相比,remove ...

  2. jQuery 核心 - noConflict() 方法,jQuery 文档操作 - detach() 方法

    原文地址:http://www.w3school.com.cn/jquery/manipulation_detach.asp   实例 使用 noConflict() 方法为 jQuery 变量规定新 ...

  3. jQuery中删除方法empty(),remove()和detach()的区别

    empty():清空匹配的元素集合中所有的子节点,自身节点和事件都未被删除. remove():这个方法不会把匹配的元素从jQuery对象中删除,因而可以在将来再使用这些匹配的元素.但除了这个元素本身 ...

  4. Jquery empty() remove() detach() 方法的区别

    方法简介: empty() This method removes not only child (and other descendant) elements, but also any text ...

  5. jquery remove() detach() empty()三种方法的区别

    remove方法把事件删除掉了,数据并没有删除 detach方法保存了事件和数据 empty方法保留了元素本身,移除子节点,删除内容 举例: <!DOCTYPE html><html ...

  6. jQuery.toggleClass() 和detach()方法详解

    一.toggleClass()函数: toggleClass()函数用于切换当前jQuery对象所匹配的每一个元素上指定的css类名.所谓"切换",就是如果该元素上已存在指定的类名 ...

  7. jQuery中detach&&remove&&empty三种方法的区别

    jQuery中empty&&remove&&detach三种方法的区别 empty():移除指定元素内部的所有内容,但不包括它本身 remove():移除指定元素内部的 ...

  8. jQuery HTML CSS 方法

    jQuery HTML / CSS 方法 下面的表格列出了所有用于处理 HTML 和 CSS 的 jQuery 方法. 下面的方法适用于 HTML 和 XML 文档.除了:html() 方法. 方法 ...

  9. ♫【jQuery】detach

    Jquery empty() remove() detach() 方法的区别 <!DOCTYPE html> <html> <head> <meta char ...

随机推荐

  1. 关于Cococs中的CCActionEase(下)

    我们前面介绍的动作主要是用来改变内部动作的执行速度,接下来要介绍的这几个动作主要是用来增加表现效果的,可以看作是简单的特效. 10)CCEaseBackIn 1 void CCEaseBackIn:: ...

  2. Core开发-后台任务利器Hangfire使用

    Core开发-后台任务利器Hangfire使用 ASP.NET Core开发系列之后台任务利器Hangfire 使用. Hangfire 是一款强大的.NET开源后台任务利器,无需Windows服务/ ...

  3. Git的思想和基本工作原理

    Git的思想和基本工作原理 Chapter: 开始了解Git 1. 先谈谈版本控制的一些事 2. Git诞生背后的一些故事 3. 版本控制:集中式VS分布式 4. Git的思想和基本工作原理 5. G ...

  4. recovery编译学习笔记

    开始建立我们要编译机器的device目录 ./build/tools/device/mkvendor.sh htc vivo ~/boot.img 需要自己配置的部分: 位置:cm/deviec/品牌 ...

  5. QT中使用Glut库

    用Qt中的QGLWidget窗体类中是不包括glut工具库的,难怪在myGLWidget(在我的程序中是QGLWidget的派生类)中绘制实心球体是说“glutSolidSphere”: 找不到标识符 ...

  6. SSD、高级格式化硬盘,4K,分区,对齐,Ghost能不能用的解释用SSD的都可以看看

    或者以上,建议选择2048,这是Win7分区使用的值,实际对齐大小就为1024K.  4.如何知道是否对齐?  使用工具AS SSD Benchmark(HDTune Pro 4.6目前测的禁绝)   ...

  7. c++ 高效文本读写

    上数据结构课,做project,数据老师要求我们多做测试,而文本文件可以有效记录这些东东,这样我想起了文件的读写,下面是渣渣我个人的一些想法,大神们看见有错的,尽管指出(orz~~~囧,木有人看我的呀 ...

  8. poj 3628 Bookshelf 2

    http://poj.org/problem?id=3628 01背包 #include <cstdio> #include <iostream> #include <c ...

  9. npm 模块安装机制简介

    npm 是 Node 的模块管理器,功能极其强大.它是 Node 获得成功的重要原因之一. 正因为有了npm,我们只要一行命令,就能安装别人写好的模块 . $ npm install 本文介绍 npm ...

  10. java的动态代理设计模式

    代码实现: package com.lky.proxy; import java.lang.reflect.InvocationHandler; import java.lang.reflect.Me ...