css test

by hiteshbhilai2010

HTML

<div class="element">Test</div>
  <ul>
    <li>First LI</li>
    <li>Second LI</li>
    <li>Third LI</li>
  </ul>

CSS

ul li:nth-child(2){
   color:blue;
    font-family: myFirstFont;
  }
body {
    font-family: myFirstFont;
    font-size: 48px;
    width: 100%;
    margin: 0;
    padding: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

@font-face {
    font-family: myFirstFont;
    src: url(sansation_light.woff);
}

JavaScript

var ruleFontName = [];
$.each(document.styleSheets, function(sheetIndex, sheet) {
    $.each(sheet.cssRules || sheet.rules, function(ruleIndex, rule) {
        if (typeof(rule.cssText) !== 'undefined' && rule.cssText.indexOf("font-face") !== -1) {
        var fntSrc = (rule.cssText. match(/src: *url\(([^;]+)\);/i) || ["", ""])[1];
        var fntName = (rule.cssText.match(/font-family: *([^;]+);/i) || ["", ""])[1];
        add(ruleFontName,fntSrc,fntName )
       }
    });
});

function add(arr, src, name) {
    var foundName = arr.some(function (el) {
      return el.fntName === name;
    });
    var foundSrc = arr.some(function (el) {
      return el.fntSrc === src;
    });
    if (!foundName && !foundSrc) {
        arr.push({ fntName: name, fntSrc: src });
        console.log(arr);
    }
   
}