# Jquery判断是否引入某个css样式文件或如何判断某元素是否具备指定的样式，以Font Awesome加载为示例

*Published:* 2020-12-16
*Author:* 来利云

![](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)![](https://p1.toutiaoimg.com/origin/fe81000329c5b3d00779)

第三方api应用如何知道调用页面是否已经加载（Font Awesome）字体的css文件？ 第一步: 向网页文档中输出了一个隐藏的Font Awesome css专有div

```javascript

    document.write('<div class="fa" style="display:none"></div>');

```

第二步: Jquery判断该div特定class的font-family或font是否包含字体（Awesome）关键词存在不 如果不存在就加载需要引用的css文件到页面 反之则不跳过

```javascript
   if ($(".fa").css("font-family").indexOf("Awesome") != -1 || $(".fa").css("font").indexOf("Awesome") != -1 ) {
            	console.log("本站已存在FontAwesome，取消加载")
            } else {
            	console.log("本站未找到FontAwesome，api将加载");
            	$("head")
            		.append("<link rel='stylesheet' id='font-awesome-css'  href='https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.14.0/css/all.min.css?ver=8.1.0' type='text/css' media='all' />")
            };

```