更新:为了让我的问题更清楚,我引用了以下代码片段并实现了类似的东西-
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
if (typeof jQuery == 'undefined') {
document.write(unescape("%3Cscript src='/js/jquery-1.4.2.min.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>
我正在以这种方式加载 font-awesome.css
和我的 JSP
中的回退-
<link type="text/css" rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.min.css" />
<script>
function fallbackForFontAwesome() {
if (typeof bootstrapcdn == "undefined") {
document.write(unescape('%3Clink type="text/css" rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/3.1.1/css/font-awesome.min.css" /%3E'));
if (typeof cloudflare == "undefined") {
document.write(unescape('%3Clink type="text/css" rel="stylesheet" href="/common/fontawesome/css/font-awesome.min.css" /%3E'));
} else {
alert('loading from cloudfare');
}
} else {
alert('loading from bootstrap cdn');
}
}
fallbackForFontAwesome();
</script>
根据此代码片段,我预计 alert('loading from bootstrap cdn');
会执行。但它没有。
代码 if (typeof bootstrapcdn == "undefined")
和 if (typeof cloudflare == "undefined")
检查 css 是否已经从各自的 URL 加载?
我哪里出错了吗?
最佳答案
您可以通过创建一个使用 FontAwesome 的“fa”类的跨度然后测试其字体来测试 FontAwesome 是否已加载。然后删除跨度并返回结果。
function isFontAwesomeLoaded() {
var span = document.createElement('span');
span.className = 'fa';
document.body.appendChild(span);
var result = (span.style.fontFamily === 'FontAwesome');
document.body.removeChild(span);
return result;
}
这个函数会给你一个 true 或 false 的结果,所以你可以使用加载本地回退(document.write 等)如果 false。
关于javascript - 加载 fontawesome 的回退计划,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26397697/