Jquery:detach（）不影响子级的父级。。。unwrap（）做的太多了_Jquery_Html_Css

Jquery:detach（）不影响子级的父级。。。unwrap（）做的太多了

jquery html css

Jquery:detach（）不影响子级的父级。。。unwrap（）做的太多了,jquery,html,css,Jquery,Html,Css,我需要明确地分离（）父div，同时保持子div不变 unwrap（）将非常适合我，但是它会删除div，我稍后会恢复它。是否有用于分离的unwrap（）方法例如： css: html 建议？以下是我的建议首先，使用创建父元素的克隆，并使用清空内容下一步使用以取出父对象最后，使用包装克隆演示：如果你有任何问题，请告诉我 body{ background: green; } #parent{ height: 500px; width: 500px; bac

我需要明确地分离（）父div，同时保持子div不变

unwrap（）将非常适合我，但是它会删除div，我稍后会恢复它。是否有用于分离的unwrap（）方法

例如： css:

html

建议？

以下是我的建议

首先，使用创建父元素的克隆，并使用清空内容

下一步使用以取出父对象

最后，使用包装克隆

演示：

如果你有任何问题，请告诉我

body{
   background: green;
}

#parent{
    height: 500px;
    width: 500px;
    background: black;
}

#red{
    height: 250px;
    width: 250px;
    background: red;
    float: left;
    margin-top: 100px;
}

<body>
    <div id="parent">
        <div id="yellow">yellow</div>
        <div id="red">red</div>  
    </div>   

</body>

$( document ).ready(function() {

    $("#yellow").click(function(){
          one();
    });

    $("#red").click(function(){
        two();
    });

});

function one(){

    $("#yellow").unwrap();  
}

function two(){

        $("#parent").appendTo("body");
        $("#yellow").appendTo("#parent");
        $("#red").appendTo("#parent"); 
}

$( document ).ready(function() {
   //clone the parent and empty out the content
   var clone = $('#parent').clone().empty();

    $("#yellow").click(function(){
          one();
    });

    $("#red").click(function(){
        two();
    });

    function one(){
        //unwraps #parent
        $("#yellow").unwrap();  
    }

    function two(){
        //use .wrapAll
        //perhaps use a class for each child element -- $('.color')
        //so you don't have to use multiple IDs in the selector -- $('#red, #blue, #yellow')
       $("#yellow, #red").wrapAll(clone);
    }  
});