0

所以我正在尝试创建一个多维文档片段并且遇到了一些障碍。我只想附加一个文档片段，以便我只创建一个回流。我基本上是在尝试创建 x 个 div，其中包含 y 个 div。我最初的想法是将 div 添加到新创建的元素中，但它似乎不起作用。我只有 2 个 for 语句，第一个是较大的 div 将进入父级，第二个是婴儿 div 将位于较大的 div 内，将进入父级。我认为我在创建一个文档片段以将所有 div 放入其中之后出错了，我尝试将其插入到尚未在 DOM 中的元素中。不过我不确定。任何反馈都会有所帮助。

function addDivs(element) {
    var newDiv, fragment = document.createDocumentFragment();
    for (var i = 0; i < numberOfPics; i++) {
        newDiv = document.createElement('div');
        var newBabyDiv, newBabyFragment = document.createDocumentFragment();
        for(var i1 = 0; i1 < o.sliceX*o.sliceY; i1++){
            newBabyDiv = document.createElement('div');
            newBabyFragment.appendChild(newBabyDiv);
        }
        newDiv.append(newBabyFragment);
        newDiv.id = (picIdRoot+i);
        newDiv.className = (o.allPictures);
        if (i < numberOfPics - 3){
        }else if(i == numberOfPics - 2){
            newDiv.className = (o.allPictures+" "+o.currentPic);
        }else if(i == numberOfPics - 1){
            newDiv.className = (o.allPictures+" "+o.currentPic+" "+o.picAfterCurrent);
        }else{}
        fragment.appendChild(newDiv);
    }

    //fill the style element with text
    var style = document.createElement("style");
    style.id = "slideShow-styling";
    fragment.appendChild(style);

    //append to slideshow container
    slideShowContainer.append(fragment);
}

编辑

for(var i1 = 0; i1 < o.sliceX*o.sliceY; i1++){
    newDiv.append(document.createElement('div'));
}

不幸的是，这个编辑不起作用

4

1 回答 1

0

我知道我迟到了，问题本身可能已经解决（或放弃）很久了。

编辑的部分

for(var i1 = 0; i1 < o.sliceX*o.sliceY; i1++){
    newDiv.append(document.createElement('div'));
}

它不起作用，因为newDiv这里没有append方法，它是一个 DOMElement，而不是任何类似 jQuery 的东西。使用 DOMElement 节点的正确语法是

for(var i1 = 0; i1 < o.sliceX*o.sliceY; i1++){
    newDiv.appendChild(document.createElement('div'));
}

与提出的问题完全无关

当我这样做时，您应该意识到该o.sliceX*o.sliceY部分会针对循环的每次迭代进行评估，我会将其更改为

for(var i1 = 0, len = o.sliceX*o.sliceY; i1 < len; i1++){...}
于 2015-09-16T13:37:34.873 回答