Question

我想要实现的目标：重新排序所有“行”-divs的内容，因此图像内容始终位于文本内容之前。

HTML：

<div class="row">
    <div class="image">image content here</div>
    <div class="text">text content here</div>
</div>
<div class="row">
    <div class="text">text content here</div>
    <div class="image">image content here</div>
</div>

之后应该是什么样子：

<div class="row">
    <div class="image">image content here</div>
    <div class="text">text content here</div>
</div>
<div class="row">
    <div class="image">image content here</div>
    <div class="text">text content here</div>
</div>

我的jQuery：

$('.row').each(function() {
    firstChild = $(this).find(':first-child');
    if(firstChild.hasClass('text')) {
        firstChild.before($(this).find('.image'));
    }
    else {
        console.log("not text");
    }
}

jQuery将图像div置于奇怪的顺序中，在我看到放置在网站上的多个图像的代码之后。请帮助：）

Answer 1

为什么不只是这个

 $(this).append(firstChild);

而不是

firstChild.before($(this).find('.image'));

<强>代码

$('.row').each(function() {
    var firstChild = $(this).find(':first-child');
    if(firstChild.hasClass('text')) {
       $(this).append(firstChild);
    }
    else {
        console.log("not text");
    }
});

<强> Check Fiddle

.before（）多次射击

1 个答案: