看看这个简单的HTML:
<div id="wrap1">
<iframe id="iframe1"></iframe>
</div>
<div id="warp2">
<iframe id="iframe2"></iframe>
</div>
Run Code Online (Sandbox Code Playgroud)
让我们说我想移动包裹,以便在#wrap2它之前#wrap1.iframe被JavaScript污染了.我知道jQuery .insertAfter()和.insertBefore().但是,当我使用它们时,iFrame会丢失所有HTML,JavaScript变量和事件.
让我们说以下是iFrame的HTML:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
// The variable below would change on click
// This represents changes on variables after the code is loaded
// These changes should remain after the iFrame is moved
variableThatChanges = false;
$(function(){
$("body").click(function(){
variableThatChanges = true;
});
});
</script>
</head>
<body>
<div id='anything'>Illustrative Example</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
在上面的代码中,variableThatChanges如果用户点击了主体,变量将会改变.移动iFrame后,此变量和click事件应保留(以及已启动的任何其他变量/事件)
我的问题如下:使用JavaScript(有或没有jQuery),我如何移动DOM中的包裹节点(以及它们的iframe子节点),以便iFrame的窗口保持不变,并且iFrame的事件/变量/等保持不变相同?