同じ親の別の要素の異なる親の中に繰り返される要素を追加する方法

オルセム

を使用して、異なる親要素で繰り返される要素を削除し、同じ親の別の要素に追加しようとしましたが、JQuery正しく機能しません

ここにあるHTMLコードは:

<div class='outer'>
  <div class='inner'>
    <h1> Text 1 </h1>
  </div>
  <span> data 1 </span>
</div>
<div class='outer'>
  <div class='inner'>
    <h1> Text 2 </h1>
  </div>
  <span> data 2 </span>
</div>

JQuery使用しコードは次のとおりです

$('span').each(function(){
  $(this).appendTo('.inner');
});

結果はJSFIDDLEにあります

私はそのような結果になる必要があります:

<div class="outer">
  <div class="inner">
    <h1> Text 1 </h1>
    <span> data 1 </span>
  </div>
</div>
<div class="outer">
  <div class="inner">
    <h1> Text 1 </h1>
    <span> data 1 </span>
  </div>
</div>
AlliterativeAlice

ブラインド$('.inner')セレクターを使用するだけで、両方の内部divを選択できます。を使用siblings()して、使用されている要素に最も近い内部divのみを選択する必要があります。

コードは次のようになります。

$('span').each(function(){
    $(this).appendTo($(this).siblings('.inner'));
});

JSFiddleの例

要素とそのターゲット宛先が実際には兄弟ではない場合、代替手段は次のようになります。

$('span').each(function(){
    $(this).appendTo($(this).closest('.outer').find('.inner'));
});

JSFiddleの例

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

jqueryを使用して親div内の同じクラスで繰り返される要素を削除する方法

分類Dev

同じ親の子要素に子要素を追加する

分類Dev

要素に追加された親の親を削除する

分類Dev

Python:リストの同じ要素を繰り返し追加する

分類Dev

xpathによって同じ親とn番目の異なる位置を持つ要素を取得する方法

分類Dev

親と同じ幅の後に疑似要素を定義する方法::

分類Dev

jQuery / JSで同じ親の別の子の子要素を取得する方法

分類Dev

親を持たない別の要素の後に要素を追加する

分類Dev

異なる要素の同じ属性のXML値を繰り返すことはできません

分類Dev

jsで繰り返されている同じ配列に要素を追加する

分類Dev

繰り返される要素の個別の値を連結するXSLT

分類Dev

異なる親要素の要素で.closestを使用する

分類Dev

同じ行に異なる高さの要素を配置します

分類Dev

同じ行に異なる高さの要素を配置します

分類Dev

CSS-異なる親の子供を同じ身長にする方法は?

分類Dev

DataFrameを、子要素と親要素の両方に同じ列が存在するネストされたディクショナリに変換する方法

分類Dev

innerTextで識別される子要素の親要素を見つける方法は?

分類Dev

ベクトルの繰り返される要素を削除し、別のベクトルの対応する要素を追加するためのループ

分類Dev

絶対位置要素が親の右境界に基づいて折り返されるのはなぜですか?

分類Dev

sql join 1 tomany-親の列を繰り返さないようにする

分類Dev

親が同じであるすべての要素を選択する方法

分類Dev

同じ親の下で要素を見つける方法

分類Dev

CSSを使用して、同じクラスで親がわずかに異なる別の子要素に影響を与えずに、クラスごとに子要素を変更する方法

分類Dev

同じクラスの要素の親IDを配列に格納し、これらの格納されたIDをアラートで表示する方法

分類Dev

追加された要素に現在の要素と同じ機能を持たせる方法

分類Dev

Pythonで同じ要素を繰り返さずに、リストから一度に1つの要素を表示する方法

分類Dev

配列内の繰り返される要素を返す

分類Dev

繰り返される要素のJavascriptを短縮する

分類Dev

親の高さが固定されていない場合、子要素を親の高さに制限する

Related 関連記事

  1. 1

    jqueryを使用して親div内の同じクラスで繰り返される要素を削除する方法

  2. 2

    同じ親の子要素に子要素を追加する

  3. 3

    要素に追加された親の親を削除する

  4. 4

    Python:リストの同じ要素を繰り返し追加する

  5. 5

    xpathによって同じ親とn番目の異なる位置を持つ要素を取得する方法

  6. 6

    親と同じ幅の後に疑似要素を定義する方法::

  7. 7

    jQuery / JSで同じ親の別の子の子要素を取得する方法

  8. 8

    親を持たない別の要素の後に要素を追加する

  9. 9

    異なる要素の同じ属性のXML値を繰り返すことはできません

  10. 10

    jsで繰り返されている同じ配列に要素を追加する

  11. 11

    繰り返される要素の個別の値を連結するXSLT

  12. 12

    異なる親要素の要素で.closestを使用する

  13. 13

    同じ行に異なる高さの要素を配置します

  14. 14

    同じ行に異なる高さの要素を配置します

  15. 15

    CSS-異なる親の子供を同じ身長にする方法は?

  16. 16

    DataFrameを、子要素と親要素の両方に同じ列が存在するネストされたディクショナリに変換する方法

  17. 17

    innerTextで識別される子要素の親要素を見つける方法は?

  18. 18

    ベクトルの繰り返される要素を削除し、別のベクトルの対応する要素を追加するためのループ

  19. 19

    絶対位置要素が親の右境界に基づいて折り返されるのはなぜですか?

  20. 20

    sql join 1 tomany-親の列を繰り返さないようにする

  21. 21

    親が同じであるすべての要素を選択する方法

  22. 22

    同じ親の下で要素を見つける方法

  23. 23

    CSSを使用して、同じクラスで親がわずかに異なる別の子要素に影響を与えずに、クラスごとに子要素を変更する方法

  24. 24

    同じクラスの要素の親IDを配列に格納し、これらの格納されたIDをアラートで表示する方法

  25. 25

    追加された要素に現在の要素と同じ機能を持たせる方法

  26. 26

    Pythonで同じ要素を繰り返さずに、リストから一度に1つの要素を表示する方法

  27. 27

    配列内の繰り返される要素を返す

  28. 28

    繰り返される要素のJavascriptを短縮する

  29. 29

    親の高さが固定されていない場合、子要素を親の高さに制限する

ホットタグ

アーカイブ