要素は親のクラス

の最初の出現に包まれたばかり、私はこれを持っている：要素は親のクラス

私は wrapAll（）使用してこれを行うことができるよ

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

：

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

のjQueryを：

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

BU私は2つのAを持っている時にT

は、のように：

<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>

それは、この中で変換されます：

<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>

それはDに最初のAのデータと第2の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>

出典

2017-06-14 NaMo

をあなただけのループに持っています。https： //jsfiddle.net/ykdrcrnt/ –

@ Karl-AndréGagnonありがとうございました。 – NaMo

あなたは.eachを使用することができます。

$(document).ready(function(){ 
 
    $(".A").each(function(){ 
 
    $(this).children().wrapAll("<div class='D' />"); 
 
    }) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<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>

出典

2017-06-14 20:59:28

ありがとう12345678. – NaMo

@ user6803164お願いします。モーハマドの答えをアップしてください。 – kblau

あなたが試すことができます。

@{ 
    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>

出典

2017-06-14 21:15:14 kblau

'wrapInner'について知らなかったので、ありがとう。いくつかのテストの後、 '.each'は必要ありません：https://jsfiddle.net/ykdrcrnt/1/ –

答えて

関連する問題