通过javascript检测正在使用的@ font-face

Question

我需要嗅探格式,<p>以便我可以将信息传递给<iframe>匹配格式.

我可以使用jQuery获取字体

var font = $("p").css('font-family');
var fsiz = $("p").css('font-size');

但是,如果font-family是一个Web字体 - 例如"Open Sans",我还需要找到@font-face加载它的规则的src .

我不知道该怎么做.

Answer 1

找到所有css定义的字体,这里演示(控制台).

function getFonts (obj) {
    var o = obj || {},
        sheet = document.styleSheets,
        rule = null,
        i = sheet.length, j;
    while( 0 <= --i ){
        rule = sheet[i].rules || sheet[i].cssRules || [];
        j = rule.length;
        while( 0 <= --j ){
            if( rule[j].constructor.name === 'CSSFontFaceRule' ){ // rule[j].slice(0, 10).toLowerCase() === '@font-face'
                o[ rule[j].style.fontFamily ] = rule[j].style.src;
            };
        }
    }
    return o;
}