jQuery 带有示例的detach()用法代码

2021年3月12日13:08:10 发表评论 788 次浏览

detach()

jQuery中的内置方法, 该方法从DOM树中删除了所选元素, 包括其所有文本节点和子节点, 但保留了数据和事件。文档对象模型(DOM)是万维网联盟的标准。这定义用于访问DOM树中的元素。

语法如下:

$(selector).detach()

参数:

它不接受任何参数。

返回值:

它返回具有所有已删除的文本和子节点的所选元素。

jQuery代码显示此方法的工作方式:

代码1:

在下面的代码中, 所有段落元素都将被分离。

< html >
  
< head >
     < script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" >
     </ script >
     < script >
         <!-- jQuery code to show detach method working -->
         $(document).ready(function() {
             $("button").click(function() {
                 $("p").detach();
             });
         });
     </ script >
     < style >
         body {
             display: block;
             width: 400px;
             height: 250px;
             padding: 20px;
             border: 2px solid green;
             font-size: 25px;
         }
     </ style >
</ head >
  
< body >
     < div > This is the div part !</ div >
     < br >
     <!-- This paragraphs get detached -->
     < p >This is the first paragraph !</ p >
     < p >This is the second paragraph !</ p >
     < button >Click Me !</ button >
</ body >
  
</ html >

输出如下:

在点击"点击我"按钮之前,

jQuery |带有示例的detach()1

单击"单击我"按钮后,

jQuery |带有示例的detach()2

木子山

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: