Javascript 如何解析[object HtmlLevel]？

将对象注入回DOM时遇到问题。我必须获取一个div，将其放入数组中，然后注入DOM。但当我注入DOM时，我显示的是[object HtmlLevel]，而不是div。我缺少什么。代码是在JSFIDLE上设置的。

提前谢谢

HTML

A.
B
C
D
E

JAVASCRIPT

    var items = $('.story');   
    var itemsPerSlide = 2;
    var parent = [];
    var children = [];

    // Divide the items in chunks
    for(var i=0; i<items.length; i++){
        if(i<itemsPerSlide){
            children.push(items[i]);
        }

        else{

            itemsPerSlide = itemsPerSlide + i;

            childrenToParent(children, parent);
            children = [];
            children.push(items[i]);
        }
    }

    childrenToParent(children, parent);
    $('.slider').append(parent);



    function childrenToParent(children, parent){
        parent.push("<li>" + extractEls(children) + "</li>");
    }


    function extractEls(children){
        var toReturn = '';
        for(var i = 0; i<children.length; i++){
            toReturn += children[i];
        }
        return toReturn;
    }

var items=$（'.story'）；
var itemsPerSlide=2；
var父项=[]；
var children=[]；
//把这些项目分成几块
对于（var i=0；i我认为这一行是您的问题：

toReturn += children[i];

这应该是，而不是：

toReturn += $(children[i]);

将
outerHTML
添加到子级

  function extractEls(children){
    var toReturn = '';
    for(var i = 0; i<children.length; i++){
         toReturn += children[i].outerHTML; //changed
    }
    return toReturn;
}

函数提取器（子项）{
var toReturn=''；
对于（var i=0；i您需要在最终代码中添加
.html（）
。我已经用此更新了您的代码您遇到的问题是将DOM节点视为字符串。向字符串添加元素会导致调用.toString（），并获得您看到的输出

如果您只是尝试将它们分组并放入lis中，那么使用slice和wrapAll就可以很容易地完成


var storyHolder=$（“#x”）.clone（）；
var stories=storyHolder.find（“.story”）；
var itemsPerSlide=2；
for（变量i=0；i”）；
故事。切片（i，i+itemsPerSlide）；
}
$（“.slider”）.append（storyHolder.children（））；


A.
B
C
D
E
只要克隆要复制其节点的容器，并从复制的容器中获取节点（如果要使原始容器完好无损）

您将它们放入数组中，然后多次运行循环。相反，您可以运行一次循环，然后同时将它们放入
.slider
类中

工作/更新：

JS部分：

var storyCopy = $("#x").clone();
var items = storyCopy.find(".story"); 
var itemsPerSlide = 2;
var counter = 0;
var LIElement = document.createElement("li");

for(var i=0; i<items.length; i++) {
    LIElement.appendChild(items[i]);
    counter++;
    if(counter >= itemsPerSlide) {
        $('.slider').append(LIElement);
        LIElement = document.createElement("li");
        counter = 0;
    }
}
$('.slider').append(LIElement);

var storyCopy=$（“#x”）.clone（）；
var items=storyCopy.find（“.story”）；
var itemsPerSlide=2；
var计数器=0；
var LIElement=document.createElement（“li”）；
对于（变量i=0；i=itemsPerSlide）{
$（'.slider'）.append（LIElement）；
LIElement=document.createElement（“li”）；
计数器=0；
}
}
$（'.slider'）.append（LIElement）；
toReturn+=children[i]；您正在对象上使用toString。这会产生您所看到的结果。您需要附加它
var storyCopy = $("#x").clone();
var items = storyCopy.find(".story"); 
var itemsPerSlide = 2;
var counter = 0;
var LIElement = document.createElement("li");

for(var i=0; i<items.length; i++) {
    LIElement.appendChild(items[i]);
    counter++;
    if(counter >= itemsPerSlide) {
        $('.slider').append(LIElement);
        LIElement = document.createElement("li");
        counter = 0;
    }
}
$('.slider').append(LIElement);