首页 > 代码库 > jQuery基础：remove（）与 detach（）区别
jQuery基础：remove（）与 detach（）区别
1、detach（）
- detach() 方法移除被选元素，包括所有文本和子节点。
- 这个方法会保留 jQuery 对象中的匹配的元素，因而可以在将来再使用这些匹配的元素。
- detach() 会保留所有绑定的事件、附加的数据，这一点与 remove() 不同。
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> p{ margin: 6px; background: yellow; } p.off{ background: red; } </style></head><body> <p>hello</p> how are <p>you?</p> <button>按钮</button></body><script src="http://www.mamicode.com/libs/jquery-1.8.3.min.js"></script><script type="text/javascript"> $(function(){ $("p").click(function(){ $(this).toggleClass("off"); }) var p; $("button").click(function(){ if(p){ p.appendTo("body"); p = null; }else{ p = $("p").detach(); console.log(p); } }) });</script></html>
2、remove（）
- 将匹配元素集合从DOM中删除。
- 同时移除元素上的事件及 jQuery 数据。
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> p{ margin: 6px; background: yellow; } p.off{ background: red; } </style></head><body> <p>hello</p> how are <p>you?</p> <button>按钮</button></body><script src="http://www.mamicode.com/libs/jquery-1.8.3.min.js"></script><script type="text/javascript"> $(function(){ $("p").click(function(){ $(this).toggleClass("off"); }) var p; $("button").click(function(){ if(p){ p.appendTo("body"); p = null; }else{ p = $("p").remove(); console.log(p); } }); //移除 =》加上，点击没反应，绑定的事件失效 });</script></html>
3、empty（）：移除匹配元素的所有子节点
4、unwrap（）:将匹配元素集合的父级元素删除，保留自身（和兄弟元素，如果存在）在原来的位置。
jQuery基础：remove（）与 detach（）区别
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。