我试图将onerror事件的事件处理程序(404错误)附加到< link>元件.
<link rel="stylesheet" type="text/css" href="dead/link.css" onerror="handle404Error()" />
它适用于Chrome和Opera,但它也适用于IE9.我找到了this,但我自己找不到解决方案.
有没有办法做到这一点,而无需编写额外的方法来动态加载样式?
注意:我没有用’jquery’标记这个问题,所以请不要在你的答案中使用它.
解决方法
在IE中,onerror事件不会触发无效的链接URL,但是onload事件会触发.
在Chrome中,情况恰恰相反:onload事件不会触发无效的链接URL,但是onerror事件会触发.
所以你需要使用这两个事件:
<link rel="stylesheet" type="text/css" href="dead/link.css" onload="handle404Error(this)" onerror="handle404Error(this,true)" /> function handle404Error(el,Failed) { if(Failed || (el.sheet.cssRules && !el.sheet.cssRules.length)) { //Failed! } else { //Success! } }
使用无效网址的示例:
使用有效URL的示例:
http://jsfiddle.net/et0g2xg6/1
2017年8月更新,感谢@Alex:
onerror
is fired by Chrome and Firefox.
onload
is fired by Internet Explorer.
Edge fires neitheronerror
noronload
.