javascript - 每个 div 类的 jQuery 查找子项和 insertAfter

Question

我正在编辑我的博客主题，我需要在特定的博文中移动(剪切和粘贴)多个特定的 div。

当前的 HTML 将是

<div class="blog_post text_post">
    <div class="post_container">
        <div class="bottom_meta"></div>
        <div class="post_date"></div>
        <div class="moreinfo"></div>
        <!-- I need .bottom_meta here -->
    </div>
</div>

我设法让它像这样工作:

$(".blog_post.text_post .bottom_meta").insertAfter(".blog_post.text_post .moreinfo");

乍一看还不错，但当我写另一篇文字帖子(通常帖子是图片)时，它让我的博客变得一团糟。 现在，代码将两个帖子中的 .bottom_meta 移动到 .moreinfo 下。

我尝试使用每个功能，但都失败了很多次...

$(".blog_post.text_post").each(function(){     
     $(this).children(".bottom_meta").insertAfter.$(this).children(".moreinfo");
});

我用“查找”功能而不是“ child ”尝试了同样的方法，仍然失败。

谁能帮我解决这个问题，或者至少给我指出正确的方向。

Answer 1

应该是:

$(".blog_post.text_post").each(function(){     
    $(this).find(".bottom_meta").insertAfter($(this).find(".moreinfo"));
});

Example Here

• 将 .insertAfter.$(this).children(...) 更改为:.insertAfter($(this).children(...))

• 此外，由于 .moreinfo/.bottom_meta 元素不是直接子元素，您需要使用 .find() 而不是 .children()。

您还可以将其简化为以下内容:

$(".blog_post.text_post").each(function () {
    $(".bottom_meta", this).insertAfter($(".moreinfo", this));
});

Example Here