• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >jquery > 老生常谈jquery中detach()和remove()的区别

老生常谈jquery中detach()和remove()的区别

作者: 字体:[增加 减小] 来源:互联网

通过本文主要向大家介绍了remove和detach的区别等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

JQuery是一个很大强的工具库,在工作中开发中,可是有些方法还是因为不常用到,或是没有注意到而被我们而忽略。

remove()和detach()可能就是其中的一个,可能remove()我们用得比较多,而detach()就可能会很少了

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

方法名

参数

事件及数据是否也被移除

元素自身是否被移除

remove

支持选择器表达

是

是(无参数时),有参数时要根据参数所涉及的范围

detach

参数同remove

否

情况同remove

remove:移除节点

- 无参数,移除自身整个节点以及该节点的内部的所有节点,包括节点上事件与数据

- 有参数,移除筛选出的节点以及该节点的内部的所有节点,包括节点上事件与数据

detach:移除节点

- 移除的处理与remove一致

- 与remove()不同的是,所有绑定的事件、附加的数据等都会保留下来

- 例如:$("p").detach()这一句会移除对象,仅仅是显示效果没有了。但是内存中还是存在的。当你append之后,又重新回到了文档流中。就又显示出来了。

eq:

<html>

<head>
  <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
  <style type="text/css">
    p {
      border: 1px solid red;
    }
  </style>
  <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>

<body>
<h3>给页面2个p元素节点绑定点击事件,点击后弹出自己本身的节点内容</h3>

<p>元素p1,同时绑定点击事件</p>

<p>元素p2,同时绑定点击事件</p>

<h3>通过点击2个按钮后观察方法处理的区别</h3>
<button>点击通过remove处理元素p1</button>
<button>点击通过detach处理元素p2</button>
</body>
<script type="text/javascript">
  //给页面上2个p元素都绑定时间 
  $('p').click(function (e) {
    alert(e.target.innerHTML)
  })

  $("button:first").click(function () {
    var p = $("p:first").remove();
    p.css('color', 'red').html('p1通过remove处理后,点击该元素,事件丢失')
    $("body").append(p);
  });

  $("button:last").click(function () {
    var p = $("p:first").detach();
    p.css('color', 'blue').text('p2通过detach处理后,点击该元素事件存在')
    $("body").append(p);
  });
</script>
</script>

</html >

以上这篇老生常谈jquery中detach()和remove()的区别就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

相关文章

  • 超炫的jquery仿flash导航栏特效
  • jQuery中replaceWith()方法用法实例
  • jquery清空textarea等输入框实现代码
  • 高效Web开发的10个jQuery代码片段
  • jQuery实现表头固定效果的实例代码
  • 常见的jQuery选择器汇总
  • 基于jQuery倾斜打开侧边栏菜单特效代码
  • JQuery中层次选择器用法实例详解
  • 基于jQuery实现的图片切换焦点图整理
  • 用jquery与css打造个性化的单选框和复选框

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • Jquery判断form表单数据是否变化
    • jQuery实现的超链接提示效果示例【附demo源码下载】
    • jquery获取table指定行和列的数据方法(当前选中行、列)
    • Jquery时间验证和转换工具小例子
    • jquery.AutoComplete.js中文修正版(支持firefox)
    • AMD异步模块定义介绍和Require.js中使用jQuery及jQuery插件的方法
    • jQuery往返城市和日期查询实例讲解
    • js/jq仿window文件夹移动/剪切/复制等操作代码
    • jQuery把表单元素变为json对象
    • jquery trigger伪造a标签的click事件取代window.open方法

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有