0

jQueryを使用していくつかのdivを別のdivにラップする必要があります。元の出力は次のようになります。

<div>Some content</div>
<div>Some content</div>

<h3>Local</h3>
<div>Some content</div>
<div>Some content</div>
<div>Some content</div>

<h3>Non-Local</h3>
<div>Some content</div>
<div>Some content</div>
<div>Some content</div>

そして、私はそれらを次のようにラップする必要があります：

<div>
    <div>Some content</div>
    <div>Some content</div>
</div>

<div>
    <h3>Local</h3>
    <div>Some content</div>
    <div>Some content</div>
    <div>Some content</div>
</div>

<div>
    <h3>Local</h3>
    <div>Some content</div>
    <div>Some content</div>
    <div>Some content</div>
</div>

divはIDまたはクラスで識別できないため、h3に続くすべてのdivをラップする方法を見つける必要があります。

4

2 に答える 2

2

あなたは出来る

  • h3要素をループします
  • jQueryの-関数を使用してnextUntil()、h3に続くdiv要素を探します。
  • それらをコレクションに追加します
  • それらのそれぞれをグループ配列にプッシュします

  • 次に、グループをループして、各グループをdiv内にラップします。

    var groups = [];

    $（'h3'）。each（function（index、value）{

    $ head = $（値）;

    var $ group = $ head.add（$ head.nextUntil（'h3'、'div'））; groups.push（$ group）;

    }）;

    for（グループ内のグループ）{

    $（groups [group]）。wrapAll（''）;

    }

最初にグループをグループ配列に保存する理由は、各コレクションをループするまでHTML構造を変更しないためです。それ以外の場合、後続の呼び出しで追加された要素も検出されます。

これがサンプルコードです。

于 2012-08-03T11:49:05.527 に答える
1

理論的には、jQuery関数「next（）」または「nextAll（）」または「nextUntill（）」を使用すると、選択した要素の次の兄弟を見つけることができます。したがって、HTMLの構造に応じて、これらの関数を使用して何かを試すことができます。

jQuery APIドキュメントのjQueryドキュメントの詳細については、こちらをご覧ください。

于 2012-08-03T10:48:47.823 に答える