javascript - 如何每 9 个项目追加一个新的 div？

Question

我正在附加一个选项数组，但我希望它在 9 个项目之后转到不同的列。我应该有条件地执行此操作，还是应该将它们全部附加，然后使用 .wrap 表示 9？

这是我所拥有的基础知识:

//array going through an each loop, item being a single item in said array

    _(all_topic).uniq().each(function (item) {
                $(".topicContainer").append('<li><input class="filterable-content__criteria" type="checkbox" name="topic" value="' + item + '" id="group3-'+item+'"><i class="hsg-icon hsg-icon-orange-checkmark"></i><label for="group3-'+ item +'">'+ item +'</label></li>')
            });

<小时/>

我应该在这之后立即运行一个函数

var topic_opts = $(".topicContainer li");
for(var i = 0; i < topic_opts.length; i+=9) {
  topic_opts.slice(i, i+9).wrapAll("<ul class="row+i"></ul>");
}

或者有什么方法可以在附加中使用条件来做到这一点？

Answer 1

也许这可能对你有帮助。这将循环遍历给定的数组并在每第 9 次迭代时添加(即 9、18、...)。请注意，如果 index == 0，index % 9 == 0 也将返回 true。

$.each(object_array, function( index, value ) {
    if (index % 9 == 0) {
        container.append('<whatever>')
    }
})