Javascript 第一次出现在父元素中的元素'；s级_Javascript_Jquery

Javascript 第一次出现在父元素中的元素'；s级

javascript jquery

Javascript 第一次出现在父元素中的元素'；s级,javascript,jquery,Javascript,Jquery,我有这个： <div class="A"> <div class="B"></div> <p>Text1</p> <div class="C"></div> </div> 文本1 我可以使用wrapAll（）执行此操作。： <div class="A"> <div class="D"> <div class="

我有这个：

<div class="A">
    <div class="B"></div>
        <p>Text1</p>
    <div class="C"></div>
</div>


文本1

我可以使用wrapAll（）执行此操作。：

<div class="A">
    <div class="D">
        <div class="B"></div>
             <p>Text1</p>
        <div class="C"></div>
    </div>
</div>


文本1

Jquery：

$(document).ready(function () { 
    $('.B, .C').wrapAll('<div class="D">');
});

$（文档）.ready（函数（）{
$（'.B，.C'）.wrapAll（''）；
});

但是

当我有两个A时，比如：

<div class="A">
    <div class="B"></div>
        <p>Text1</p>
    <div class="C"></div>
</div>

<div class="A">
    <div class="B"></div>
        <p>Text2</p>
    <div class="C"></div>
</div>


文本1
文本2

它在以下情况下转换：

<div class="A">
    <div class="D">
        <div class="B"></div>
            <p>Text1</p>
        <div class="C"></div>
        <div class="B"></div>
            <p>Text2</p>
         <div class="C"></div>
     </div>
</div>
<div class="A"></div>


文本1
文本2

它将第一个A和第二个A的数据包装到D中，并将其保存在第一个A中。我希望将两个A与各自的内容分开。我希望输出为：

<div class="A">
    <div class="D">
        <div class="B"></div>
            <p>Text1</p>
        <div class="C"></div>
     </div>
</div>
<div class="A">
    <div class="D">
        <div class="B"></div>
            <p>Text2</p>
        <div class="C"></div>
     </div>
</div>


文本1
文本2

您可以使用

。每个：

$（文档）.ready（函数（）{
$（“.A”）。每个（函数（）{
$（this.children（）.wrapAll（“”）；
})
})

文本1
文本2
您可以尝试：
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>IndexGH1</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#btnGo").click(function () {
                //rap b,c in d
                //this takes
                //from:
                //<div class="A">
                //  <div class="B"></div>
                //  <p>Text1</p>
                //  <div class="C"></div>
                //</div>
                //to:
                //<div class="A">
                //  <div class="D">
                //      <div class="B"></div>
                //      <p>Text1</p>
                //      <div class="C"></div>
                //  </div>
                //</div>
                //$(".A").wrapInner("<div class='D'></div>"); 

                var elems = $(".A").each(function () {
                    $(this).wrapInner("<div class='D'></div>");
                })

            })

        })
        </script>
</head>
<body>
    @*1st example, note i am useing wrapinner instead of wrapall
    <div class="A">
        <div class="B"></div>
        <p>Text1</p>
        <div class="C"></div>
    </div>*@
    <div class="A">
        <div class="B"></div>
        <p>Text1</p>
        <div class="C"></div>
    </div>

    <div class="A">
        <div class="B"></div>
        <p>Text2</p>
        <div class="C"></div>
    </div>
    <input type="button" id="btnGo" value="Go" />
</body>
</html>

@{
布局=空；
}
索引GH1
$（函数（）{
$（“#btnGo”）。单击（函数（）{
//说唱b，c在d中
//这需要
//发件人：
//
//  
//Text1
//  
//
//致：
//
//  
//      
//Text1
//      
//  
//
//美元（“.A”）.wrapInner（“”）；
var elems=$（“.A”）。每个（函数（）{
$（此）.wrapInner（“”）；
})
})
})
@*第一个示例，请注意，我使用的是wrapinner而不是wrapall
文本1
*@
文本1
文本2
你只需循环：@Karl AndréGagnon谢谢。我不知道wrapInner
，所以谢谢你。经过一些测试后，不需要。每个：