ror*_*ryf 19 html javascript iframe onload-event
我一直在玩将隐藏的iframe元素添加到页面中,并且我希望在加载后操纵这些元素的DOM.我注意到,在将iframe添加到页面后,我无法立即开始操作DOM,因为它还没有加载.这不能用DOMContentLoaded事件来完成,因为它会触发iframe中不存在的文档,直到它被添加到页面中,因此我们必须使用该load事件.
这是一些测试代码:
var iframe = document.createElement('iframe');
iframe.onload = function() { console.log('loaded!'); };
document.getElementsByTagName('body')[0].appendChild(iframe);
Run Code Online (Sandbox Code Playgroud)
这按预期工作,但是当我将其更改为addEventListener它甚至没有添加到DOM:
var iframe = document.createElement('iframe');
iframe.addEventListener('load', function() { console.log('loaded!'); });
document.getElementsByTagName('body')[0].appendChild(iframe);
Run Code Online (Sandbox Code Playgroud)
我还没有attachEvent在IE中测试过.
有人对此有所了解吗?
Hra*_*ian 19
addEventListener()功能需要3个参数!看看https://developer.mozilla.org/en/DOM/element.addEventListener
第三个参数被标记为可选,但随后他们写道:
请注意,此参数在所有浏览器版本中都不是可选的.
我不确定它何时何地需要,但我在FF4上的测试在调用addEventListener带有2个参数时引发了异常:
未捕获的异常:[异常......"参数不够"nsresult:"0x80570001(NS_ERROR_XPC_NOT_ENOUGH_ARGS)"位置:"JS frame :: http://localhost/index.php :: :: line 10"数据:否]
顺便说一句,您的代码在Chrome中运行良好[字符串loaded!在控制台中记录].
像FF一样,IE9需要标准模式中的第3个参数(带<!DOCTYPE html>).IE9是第一个支持W3C事件模型的IE.所以在早期版本中我们需要尝试attachEvent.我没有早期的IE,但它在IE7/8标准模式下工作,甚至在IE9中的Quirks模式下工作.这是我使用的代码:
<!DOCTYPE html>
<html>
<head><title></title></head>
<body>
<script>
window.onload=function(){
var iframe = document.createElement('iframe');
var func = function() { console.log('loaded!');};
if(iframe.addEventListener)
iframe.addEventListener('load', func, true);
else if(iframe.attachEvent)
iframe.attachEvent('onload',func);
document.body.appendChild(iframe);
}
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
44924 次 |
| 最近记录: |