各浏览器对link标签onload/onreadystatechange事件支持的差异分析_javascript技巧

1，onload事件

复制代码 代码如下:

IE6/7 :

IE8/9 :

Opera :

即IE6/7/8/9/Opera都支持onload事件， Firefox/Safari/Chrome不支持。

注：用JS创建link标签再添加到head中，情况如上。
2，onreadystatechange事件

复制代码 代码如下:

IE6/7/8/9中弹出了两次，其它浏览器均没有弹。说明只有IE支持link元素的onreadystatechange事件。弹出两次分别是readyState为loading，complete状态。可使用readyState来判断载入情况。我们再使用JS动态创建link元素试试，

复制代码 代码如下:

<script> <BR>function createEl(type, attrs){ <BR>var el = document.createElement(type), <BR>attr; <BR>for(attr in attrs){ <BR>if(attrs.hasOwnProperty(attr)){ <BR>el.setAttribute(attr, attrs[attr]); <BR>} <BR>} <BR>return el; <BR>} <BR>var link = createEl('link', { <BR>href : 'http://i3.sinaimg.cn/rny/webface/login/css/login101021_min.css', <BR>rel : 'stylesheet', <BR>type : 'text/css' <BR>}); <BR>link.onreadystatechange = function(){ <BR>alert(this) <BR>} <BR>document.getElementsByTagName('head')[0].appendChild(link); <BR></script>

IE6/7/8/9中仍然弹出了2次。Firefox/Safari/Chrome仍然没弹。貌似一切正常，但神奇的是这次在Opera中弹出了一次，说明Opera支持动态创建link元素时的onreadystatechange事件。

相关：

https://developer.mozilla.org/en/HTML/Element/link
http://msdn.microsoft.com/en-us/library/ms535848%28v=VS.85%29.aspx
http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-html.html#ID-35143001