我需要动态地将主体内容包装在div中。我尝试了下面的代码,我得到了“newDiv.append函数是未定义的”。我也尝试了setTimeout,并在加载了用于循环的jquery文件之后进行了检查。仍然得到相同的错误。
function initiate() {
var jq_script = document.createElement('script');
jq_script.setAttribute('src', '//code.jquery.com/jquery-1.11.2.min.js');
document.head.appendChild(jq_script);
var newDiv = document.createElement('div')
newDiv.setAttribute('id', 'wrapper');
var bodyChildren = document.body.childNodes;
for (var i = 0; i < bodyChildren.length; i++) {
newDiv.append(bodyChildren[i]);
}
document.body.appendChild(newDiv);
}
initiate();
我也尝试过用innerHTML元素包装身体的div元素。
function initiate() {
var jq_script = document.createElement('script');
jq_script.setAttribute('src', '//code.jquery.com/jquery-1.11.2.min.js');
document.head.appendChild(jq_script);
var div = document.createElement("div");
div.id = "wrapper";
while (document.body.firstChild) {
div.appendChild(document.body.firstChild);
}
document.body.appendChild(div);
}
initiate();
这会继续在body中添加包装器元素。上面的脚本在iframe中。
对此有什么解决方案吗?
发布于 2015-05-05 20:01:14
两个问题:
但是,另一个问题在您的循环中:childNodes
是一个动态列表,因此当您将一个子级从body
移到newDiv
中时,该列表会发生变化,从而使您的索引无效。
你可以通过循环来解决这个问题,将第一个孩子移到你的div中,直到body
用完所有的孩子,然后附加div:
var newDiv = document.createElement('div') newDiv.id = "wrapper";//这里不需要也不想要setAttribute var bodyChildren = document.body.childNodes;while (bodyChildren.length) { newDiv.appendChild(bodyChildren);} document.body.appendChild(newDiv);
或者实际上,你甚至不需要列表,你可以使用firstChild
:
document.body.appendChild(newDiv); newDiv = document.createElement('div') newDiv.id = "wrapper";//当(document.body.firstChild) { newDiv.appendChild(document.body.firstChild);} var时,这里不需要或不想要setAttribute
https://stackoverflow.com/questions/30052347
复制相似问题