html - 如果 CDN 失败，如何回退到本地样式表(不是脚本)

Question

我正在链接到 CDN 上的 jQuery Mobile 样式表，如果 CDN 失败，我想回退到我本地版本的样式表。对于脚本，解决方案是众所周知的:

<!-- Load jQuery and jQuery mobile with fall back to local server -->
<script src="http://code.jquery.com/jquery-1.6.3.min.js"></script>
<script type="text/javascript">
  if (typeof jQuery == 'undefined') {
    document.write(unescape("%3Cscript src='jquery-1.6.3.min.js'%3E"));
  }
</script>

我想为样式表做类似的事情:

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b3/jquery.mobile-1.0b3.min.css" />

我不确定是否可以实现类似的方法，因为我不确定浏览器在链接脚本时是否以与加载脚本时相同的方式阻塞(也许可以在脚本中加载样式表标记，然后将其注入(inject)页面)？

所以我的问题是:如果 CDN 失败，如何确保在本地加载样式表？

Answer 1

可以使用 onerror为此:

<link rel="stylesheet" href="cdn.css" onerror="this.onerror=null;this.href='local.css';" />

this.onerror=null; 是为了避免无限循环，以防万一它自己的回退不可用。但它也可以用于多个回退。

但是，这目前仅适用于 Firefox 和 Chrome。

更新:同时，这似乎是supported by all common browsers .