使用Google CDN托管jQuery UI CSS并具备本地回退机制？

Question

我已经有以下JS文件：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">!window.jQuery && document.write(unescape("%3Cscript src='/app_shared/script/jquery-1.6.1.min.js' type='text/javascript'%3E%3C/script%3E"))</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.min.js"></script>
<script type="text/javascript">!window.jQuery.ui && document.write(unescape("%3Cscript src='/app_shared/script/jquery-ui.min.js' type='text/javascript'%3E%3C/script%3E"))</script>

如何找到类似的主题呢？我可以像这样从CDN下载：

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>

但是，如果文件下载失败，我该如何检测到并引用本地副本呢？我知道如何使用jQuery程序添加本地副本，但我不知道如何检查CSS下载是否成功。此外，<link>标签下载是阻塞的还是异步的？这也可能会成为一个问题。

- bevacqua

Answer 1

你也可以尝试类似这样的操作：使用Javascript/jQuery从外部样式表中获取CSS值

<style>
p {color: blue}
</style>

$(document).ready(function() {
    var $p = $("<p></p>").hide().appendTo("body");
    alert($p.css("color"));
    $p.remove();
});

- Amir Raminfar

Answer 2

你可以进行样式检查，其中字体应该是特定的字体族，然后根据该族名称进行检查。如果名称不是您期望的，则加载本地副本。

- Seth

---

我正在寻找比那更强大/一致的东西。 - bevacqua

真的没有其他办法。你必须等待CSS加载完成，然后检查一些样式。不是说element.style不起作用，而是还有另一个需要使用的，它可以检查从外部文件加载的样式。 - Amir Raminfar

CSS可以异步加载，因此我们需要模拟一个on_CSS_failed事件。 - Karolis

另一种方法是使用JS加载CSS文件，然后使用onError事件来检查它是否加载。缺点是在文件加载之前会出现非样式化内容的闪烁...就像使用基于JS的Web字体服务一样。 - Seth