首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >包装主体的innerHTML的div元素

包装主体的innerHTML的div元素
EN

Stack Overflow用户
提问于 2015-05-05 19:59:00
回答 1查看 1.2K关注 0票数 1

我需要动态地将主体内容包装在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中。

对此有什么解决方案吗?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 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

票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/30052347

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档