源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

jQuery中detach()方法用法实例

  • 时间:2021-01-04 14:46 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:jQuery中detach()方法用法实例
本文实例讲述了jQuery中detach()方法用法。分享给大家供大家参考。具体分析如下: 此方法从DOM中删除所有匹配的元素。 [b]说明:[/b]detach()方法不会把匹配的元素从jQuery对象中删除,因而可以在将来再使用这些匹配的元素,与remove()不同的是,所有绑定的事件、附加的数据等都会保留下来。 [b]语法结构: [/b]
[u]复制代码[/u] 代码如下:
$(selector).detach(expr)
[b]参数列表: [/b]
参数 描述
expr 可选。用于筛选被删除元素的jQuery表达式。
[b]实例代码:[/b] 实例一:
[u]复制代码[/u] 代码如下:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.1sucai.cn/" /> <title>编程素材网</title> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript">  $(document).ready(function(){   $("button").click(function(){     $("div").detach("#first");   }); }) </script>  </head> <body>   <div id="first">欢迎来到编程素材网</div>   <div>编程素材网欢迎您</div>   <button>点击查看效果</button> </body> </html>
以上代码能够删除div集合中id值为first的div。 实例二:
[u]复制代码[/u] 代码如下:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.1sucai.cn/" /> <title>编程素材网</title> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript">  $(document).ready(function(){   $("button").click(function(){     $("div").detach();   }); }) </script> </head> <body> <div id="first">欢迎来到编程素材网</div> <div>编程素材网欢迎您</div> <button>点击查看效果</button> </body> </html>
如果方法没有参数,那么将会删除所有匹配元素。 实例三:
[u]复制代码[/u] 代码如下:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.1sucai.cn/" /> <title>编程素材网</title> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript">  $(document).ready(function(){   $("#btd").click(function(){     var a=$("div");     a.detach("#first");     $("#btn").click(function(){       alert(a.length);     });   }); }) </script>  </head> <body>   <div id="first">欢迎来到编程素材网</div>   <div id="second">编程素材网欢迎您</div>   <button id="btd">删除div效果</button>   <button id="btn">查看删除操作后div的数量</button> </body> </html>
以上代码的运行结果可以看出,此方法并没有将div从jquery对象中删除。 希望本文所述对大家的jQuery程序设计有所帮助。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部