1

私はjqueryを初めて使用し、この有名なフレームワークに慣れるためにそれをいじっています。私は、jquery のセレクターの "宣言型" の性質が気に入っています。SQL のように、一致した各要素を明示的にループする必要なく、一連の要素を取得してそれらに対して何かを実行できます。jquery を探索している間、私は自分自身にシナリオ/課題を与え、それらを解決して自分の理解をテストできるかどうかを確認します。これは、できれば 1 行のコード (セミコロンを 1 つだけ使用) で解決しようとしている問題の 1 つです。

<div>
    <div class="parent">
        <div></div>
    </div>
</div>

<div>
    <div class="parent">
        <div></div>
    </div>
</div>

<div>
    <div class="parent">
        <div></div>
    </div>
</div>

だから私の問題はこのようなものです。<div>「祖父母 - 親 - 子」の関係を作成する3 つの があり、1 つはもう一方の内部にネストされています。上記のような取り決めが 3 つあります (根本的に兄弟である 3 人の祖父母)。だから私の質問は、どうすればすべての子供を自分のそれぞれの祖父母に移すことができるの<div>ですか? つまり、子供たちを自分の親の兄弟にしようとしているのです。以下に示すのは、私が達成しようとしている結果です

<div>
    <div class="parent">
    </div>
    <div></div>
</div>

<div>
    <div class="parent">
    </div>
    <div></div>
</div>

<div>
    <div class="parent">
    </div>
    <div></div>
</div>

これが私が無駄にしようとしたものです

$('.parent > div').appendTo($(this).parent());

私も試してみました

$('.parent > div').appendTo($(this).parent().parent());

私は$(this)ここで悪用していると思います。ループを使わずに 1 行だけでそれを行う方法がわかりませんでした。私は .each() ループでそれを行うことができるかもしれないと思いますが、それなしでそれを達成したいと思います. これを読んでくれてありがとう。

4

4 に答える 4

3

それらをループする必要があります：

$('.parent > div').each(function() {
    $(this).parent().after(this);
});

次のように書くこともできます。

$('.parent > div').each(function() {
    $(this).insertAfter($(this).parent());
});
于 2013-03-29T22:11:13.320 に答える
3

ループのない別のソリューション (おそらく jquery 自体のループです):

$('.parent').after(function() {
    return $('div', this);
});
于 2013-03-29T22:28:59.133 に答える
0 
$('.parent div').each(function(){$(this).clone().appendTo($(this).parent().parent());$(this).remove()})
于 2013-03-29T22:13:57.127 に答える
0

さて、これまでのすべての回答は を使用eachしており、これが最善の方法です。しかし、奇妙に見えるようにするために、明示的なループを回避する別の方法を次に示します。

$('.parent > div').unwrap().parent().contents().filter(function(){return this.nodeType===3}).wrap('<div class="parent">');

(内部的に多くfilterのループがあり、ループですが、jQuery にはテキスト ノードを取得する組み込みの方法がありません)

于 2013-03-29T22:26:03.280 に答える