jQuery DOM操作unwrap()方法

我们可以通过wrap方法给选中元素增加一个包裹的父元素。相反,如果删除选中元素的父元素要如何处理 ?

    jQuery提供了一个unwarp()方法 ,作用与wrap方法是相反的。将匹配元素集合的父级元素删除,保留自身(和兄弟元素,如果存在)在原来的位置。

下面我们来写一个实例:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
    <div>
        <p>元素</p>
    </div>

    <script>
        $("p").unwrap("<div></div>");
    </script>
</body>
</html>

小伙伴们可以在本地运行,然后在浏览器中按F12进行调试,或者使用快捷键ctrl+shift+i ,大家可以看到我们先开始写的div标签就已经被删除了

大家注意,我们之前删除有remove  或者 empty 方法,这个是会把其中的元素都给删除,而unwrap方法是只删除父节点,但是不删除子节点,这个方法比较简单,大家参考上面的案例即可

继续学习
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <div> <p>元素</p> </div> <script> $("p").unwrap("<div></div>"); </script> </body> </html>
提交重置代码