如何获得字体的样式？

Question

所以我想使用 JavaScript 确定元素的字体是 sans-serif、serif 还是 monospace。这是用于 Google Chrome 扩展，因此它只需要在 Google Chrome.

中工作

该扩展程序将用于用浏览器的默认字体替换每个元素的字体。因此，例如，如果默认的 sans-serif 字体是 Arial，并且元素的字体被检测为 sans-serif，则该元素的字体将更改为 Arial。

此外，由于可以为多种语言指定默认字体，是否还有一种方法可以确定元素的语言？

编辑：

如果我通过检查 sans-serif、serif 或 monospace 是否被指定为后备字体来解决这个问题呢？

看来我必须遍历文档中的每个元素才能确定应用于它的字体。最有效的方法是什么？或者我可以在不遍历每个元素的情况下执行此操作吗？

这就是我想出的：

/* main.js */

var elements=document.getElementsByTagName('*');

for(var i=0;i<elements.length;++i){
    var fontFamily=getComputedStyle(elements[i]).getPropertyValue('font-family');

    if(~fontFamily.indexOf('monospace')){
        fontFamily='monospace';
    }
    else if(~fontFamily.indexOf('sans-serif')){
        fontFamily='sans-serif';
    }
    else if(~fontFamily.indexOf('serif')){
        fontFamily='serif';
    }
    else{
        fontFamily='';
    }

    elements[i].style.fontFamily=fontFamily;
}

并且在 manifest.json:

"content_scripts":[
    {
        "matches":[
            "<all_urls>"
        ],
        "js":[
            "main.js"
        ],
        "run_at":"document_end"
    }
]

如果我是对的，这会将所有元素的字体设置为通用字体，然后由浏览器自动替换？

Answer 1

要获取元素的字体类型，您可以尝试这种方法：http://jsfiddle.net/vCmtk/1/

要获取该语言，有几个解决方法。可以依靠navigator.language函数获取当前的language/region。如果您正在为您的扩展实现 i18n，那么此函数将检索当前语言：chrome.i18n.getUILanguage()

如何获得字体的样式？

How can I get the style of a font?

javascript

google-chrome-extension