And*_*dez 2 html javascript iframe
我在iframe上测试事件,我遇到了一些非常奇怪的事情.我已经四处寻找同样问题的其他人,但没有找到具有这些特征的人.
我有一个包含iframe的页面:
<!-- index.html -->
<body>
<h1>Parent</h1>
<h4><a href="index2.html">...go to the 2nd page...</a></h4>
<iframe src="iframe.html"></iframe>
<script type="text/javascript">
window.addEventListener('load', function(){
console.log('parent loaded');
});
</script>
</body>
和iframe:
<body>
<h1>Iframe</h1>
<script type="text/javascript">
var i = 0;
window.addEventListener('load', function(){
window.top.console.log('iframe loaded', i++);
document.body.innerHTML += '<h3>loaded</h3>';
});
</script>
</body>
当我加载页面时,iframe上的onload事件运行两次,甚至更奇怪,看起来iframe本身被加载两次,因为<h3>loaded</h3>控制台看起来像这样的元素(变量i是两次'0'):
iframe loaded 0 iframe.html:11
parent loaded (index):13
iframe loaded 0 iframe.html:11
要添加到怪异,如果我没有在父文件上附加onload事件,iframe的onload只能运行一次.
如果您想在不受干扰的情况下运行它,请访问http://sureshots.andrepadez.com/iframetest/
我需要知道我做错了什么,或者这是一个已知的问题,我该如何解决它.
修改body.innerHTML属性时,会导致重新考虑整个body元素.iframe元素有效地从DOM中删除并再次插入,导致它加载两次.
违规行:
document.body.innerHTML += '<h3>loaded</h3>';
| 归档时间： |
|
| 查看次数： |
4282 次 |
| 最近记录： |