javascript - jQuery .before() は、定義したとおりにコンテンツを挿入しません

Question

私は次のHTMLを持っています

HTML

<aside>
  <section class="links"></section>
  <section class="downloads"></section>
  <section class="news"></section>
  <section class="contact"></section>
<aside>

section.news の前に挿入しようとして</aside><aside>います (aside コンテナー タグを、それぞれに 2 つのセクションを持つ 2 つの aside コンテナーに効果的に分割します)

jQuery

私が使う：

$("aside section.news").before("</aside><aside>");

問題

Jqueryは、私が望む<aside></aside>のではなく、常に出力します。</aside><aside>

Answer 1

これを行う「適切な」方法は次のとおりです。

• aside 要素を作成する
• 既存の aside 要素の後に挿入します
• その中に目的の要素を移動します

var $aside1 = $("aside:first");
var $aside2 = $("<aside><\/aside>").insertAfter($aside1);
$(".news").nextAll().addBack().appendTo($aside2);

デモはこちら

Answer 2

$(document).ready(function(){
    var one = $('aside').children().eq(0).clone().wrap('<p>').parent().html() + $('aside').children().eq(1).clone().wrap('<p>').parent().html()
    var two = $('aside').children().eq(2).clone().wrap('<p>').parent().html() + $('aside').children().eq(3).clone().wrap('<p>').parent().html()
    $('aside').before('<aside>'+one+'</aside');
    $('aside').eq(1).html(two);

    console.log(one)
    console.log(two)
});