Javascript 在多个div中的第一个和最后一个ul之后添加元素

我有这个html：

<div class="parent-div" id="uniqueidnumber">
<div class="col-xs-6">
<p>some text</p>
<p>some text</p>
<ul>
<li>some text</li>
<li>some text</li>
</ul>
<!-- here opened div should end and new with same class opened -->
<p>some text</p>
<ul>
<li>some text</li>
<li>some text</li>
</ul>
<!-- here div should end -->
<p>some text</p>
</div>

有多个父div，正如我在评论中所说的，我需要先关闭打开的div，然后用同一个类打开新div，最后关闭该div。 有了这个代码，我得到了first in first parent-div下的每个父div的n个编号

$('.parent-div').each(function() {
    $('.parent-div ul').first().after('</div><div class="col-xs-6">');
    $('.parent-div ul').last().after('</div>');
})

---

如何在first和last之后在每个父div中插入所需的代码？

这是一个有趣的问题。。。但我相信这是你想要的

---

这是一个有趣的问题。。。但我相信这是你想要的

那么

假设您希望将第一个ul之后的所有元素移动到新列，这应该适用于您：

$('.parent-div').each(function() {
    var newDiv = $('<div></div>', {'class': 'col-xs-6'});
    var found = false;
    $('div.col-xs-6', this).children().each(function(){
        if(!found && !$(this).is('ul')) {
            return;
        } else if(!found) {
            found = true;
        } else {
            $(this).clone().appendTo(newDiv);
            $(this).remove();
        }
    });
    newDiv.appendTo(this);
})

希望有帮助。

嗯

假设您希望将第一个ul之后的所有元素移动到新列，这应该适用于您：

$('.parent-div').each(function() {
    var newDiv = $('<div></div>', {'class': 'col-xs-6'});
    var found = false;
    $('div.col-xs-6', this).children().each(function(){
        if(!found && !$(this).is('ul')) {
            return;
        } else if(!found) {
            found = true;
        } else {
            $(this).clone().appendTo(newDiv);
            $(this).remove();
        }
    });
    newDiv.appendTo(this);
})

---

希望有帮助。

您不能只附加开始或结束标记。您需要手动修改代码。是的，您的html代码无效，导致缺少结束标记-这是一件不好的事情。您不能只附加开始或结束标记。你需要手动修改你的代码。是的，你的html代码是无效的，因为缺少结束标记-这是一件不好的事情。这与你之前回答的我的anwser中使用的方法基本相同+1这与我的回答中使用的方法基本相同，你回答得比我早+1请注意，看起来您需要添加一些内容，以确保上一个ul之后的内容不会添加到第二个col-xs-6中@斯默尼：是的，还有，下一步直到新的col-xs-6中最后一个ul元素没有被解开：这就是我特别附加它的原因。@斯默尼：哦，是的！对不起，我没看到那条线。事实上，对不起，这条线并不像我想的那么近。它所做的只是将第一个ul之后的所有内容（包括最后一个ul之后的内容）附加到新的div中，并在此过程中执行许多不必要的DOM操作。每个块都可以替换为$'div.col-xs-6'，this.children'ul'.first.nextAll.appendTonewDiv；对于相同的结果，只需2个DOM操作，而不是2*n，其中n是第一个ul之后的元素数。非常接近，看起来您需要添加一些内容，以确保最后一个ul之后的内容不会添加到第二个col-xs-6@斯默尼：是的，还有，下一步直到新的col-xs-6中最后一个ul元素没有被解开：这就是我特别附加它的原因。@斯默尼：哦，是的！对不起，我没看到那条线。事实上，对不起，这条线并不像我想的那么近。它所做的只是将第一个ul之后的所有内容（包括最后一个ul之后的内容）附加到新的div中，并在此过程中执行许多不必要的DOM操作。每个块都可以替换为$'div.col-xs-6'，this.children'ul'.first.nextAll.appendTonewDiv；对于相同的结果，只有2个DOM操作，而不是2*n，其中n是第一个ul之后的元素数。

$('.parent-div').each(function() {
    var newDiv = $('<div></div>', {'class': 'col-xs-6'});
    var found = false;
    $('div.col-xs-6', this).children().each(function(){
        if(!found && !$(this).is('ul')) {
            return;
        } else if(!found) {
            found = true;
        } else {
            $(this).clone().appendTo(newDiv);
            $(this).remove();
        }
    });
    newDiv.appendTo(this);
})