所以我有一个基本的递归函数工作,但我想将x个数的子节点附加到当前父节点。但是我的递归函数中的for循环似乎只向它当前的父节点追加了1个子节点。这里是我的代码的js bin:任何帮助非常感谢!http://jsbin.com/bihuvotupe/1/edit?html、js、输出
function populate(parent, n){
// loop and append
if(n === 0){
return;
}else{
n--;
var child = boxHelper("40%", "40%");
for(var i = 0; i <= 4; i++){
console.log(i);
parent.appendChild(child);
}
populate(child, n);
}
}
var mother = boxHelper("600px", "600px");
document.body.appendChild(mother);
populate(mother, 4);
// makeNodeRefs(callender);
function boxHelper(height, width){
var element = document.createElement("div");
element.style.height = height;
element.style.width = width;
//element.style.background = colour;
element.style.float = "left";
element.style.margin = "5px";
element.style.border = "2px solid black";
element.style.borderRadius = "3px";
// element.classList.add("inflate");
return element;
}
如果您的for
循环,您不会创建4个新的子节点。您只是创建了一个,并试图将其附加到parent
。
http://jsbin.com/suhukiviqi/1/edit?html、js、输出
单个节点只能在DOM中的一个位置。您的代码创建单个节点,然后尝试将其附加到几个不同的位置。节点将在最后一个位置结束。
将调用移动到 for
循环内的boxHelper()
函数