jquery - 複数回ラップ要素にの間に jQueryを使用して、これを変換したいと思います: <h3>Question 1</h3> <p>Answer 1 P1</p> <p>Answer 1 P2</p> <h3>Question 2</h3> <p>Answer 2 P1</p> &l

Question

jQueryを使用して、これを変換したいと思います:

<h3>Question 1</h3>
<p>Answer 1 P1</p>
<p>Answer 1 P2</p>

<h3>Question 2</h3>
<p>Answer 2 P1</p>
<p>Answer 2 P2</p>
<p>Answer 2 P3</p>

の中へ：

<ul>
   <li>
       <h3>Question 1</h3>
       <div>
          <p>Answer 1 P1</p>
          <p>Answer 1 P2</p>
       </div>
    </li>
    <li>
       <h3>Question 2</h3>
       <div>
          <p>Answer 2 P1</p>
          <p>Answer 2 P2</p>
          <p>Answer 2 P3</p>
       </div>
    </li>
</ul>

どんな提案でも大歓迎です。

ありがとうございました！

Answer 1

私は、各要素の後にあるnextUntilすべての要素を選択し、それをusingでラップしてから、要素を追加してそれもでラップし、それをに追加しています。基本的に、ph3divwrapAllh3liul

var ul = $('<ul>').prependTo('body');

$('h3').each(function(){
    $(this).nextUntil('h3')
        .wrapAll('<div>').parent().add(this)
        .wrapAll('<li>').parent().appendTo(ul);
});

簡単なデモについては、http：//www.jsfiddle.net/yijiang/SjDe2/1を参照してください。

Answer 2

面白い！いろいろな解決策を待ち望んでいます。

理論的には、セレクター$('h3, p').each(logic)を使用してこれらすべての項目を調べ、タグh3に遭遇すると、 li、h3、およびdivを作成し、 pに遭遇すると、divにpを追加します。