尝试 jQuery wrapAll 似乎将内容包装两次
我得到了一个如下所示的标记：
<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>
I got a markup looking like this :
<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>
I want it to end up that way :
<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>
So I can populate #isolated-component and easily discard them from a jQuery selection.
I tried that :
jQuery("body").children().wrapAll("<div id='body-content'></div>")
.after("<div id='isolated-component'></div>");
But ended up with :
<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>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
好吧，我找到原因了。当你将body内容移动到DIV时，它会移动脚本标签，包括移动内容的JS，并导致脚本第二次执行。现在我不知道为什么这不会以无限循环结束，但很高兴知道：永远不要移动脚本标签，你会让它们重新加载。
Ok, I found why. When you move the body content to the DIV, it moves the script tags including the JS moving the stuff and lead the script to execute a second time. Now I don't know why this doesn't end up in a infinite loop, but it's good to know : don't ever move script tags, you will make them reload.
我不确定这是否能解决您的问题，但您应该使用
wrapInner：I'm not sure if this will fix your problem but you should use
wrapInner: