Question

我得到了这样的标记：

<body>
    <...
    a lot of tags from the web site
    ...>
    <script type="text/javascript" src="http://cdn.jquerytools.org/1.1.1/jquery.tools.min.js"></script>
    <script type="text/javascript" src="my_script.js"></script>
<body>

我希望它以这种方式结束：

<body>
    <div id="body-content">
        <...
        a lot of tags from the web site
        ...>
        <script type="text/javascript" src="http://cdn.jquerytools.org/1.1.1/jquery.tools.min.js"></script>
        <script type="text/javascript" src="my_script.js"></script>
    </div>
    <div id="isolated-component">
</div>
<body>

所以我可以填充＃isolated-component并轻松地从jQuery选择中丢弃它们。

我试过了：

jQuery("body").children().wrapAll("<div id='body-content'></div>")
                        .after("<div id='isolated-component'></div>");

但最终得到了：

<html>
<head>
<body>
    <div id="body-content">
        <div id="body-content">
            <... page content ...>
        </div>
        <div id="isolated-component"/>
        <div id="isolated-component"/>
    </div>
    <script src="my_script.js" type="text/javascript">
    </script>
</body>
<div id="_firebugConsole" style="display: none;" FirebugVersion="1.4.3" methodName="log"/>
</html>

Answer 1

好的，我找到了原因。当您将正文内容移动到DIV时，它会移动脚本标记，包括JS移动内容并引导脚本再次执行。现在我不知道为什么这不会以无限循环结束，但是最好知道：不要移动脚本标签，你会让它们重新加载。

Answer 2

我不确定这是否能解决您的问题，但您应该使用wrapInner：

jQuery("body").wrapInner("<div id='body-content'></div>")
    .after("<div id='isolated-component'></div>");

尝试jQuery wrapAll似乎将内容包装两次

2 个答案: