仅通过 javascript 进行字体检测（无 flash）答案

【问题标题】：font detection through javascript only( no flash)仅通过 javascript 进行字体检测（无 flash）
【发布时间】：2013-06-24 20:22:18
【问题描述】：

这里是通过 javascript,css 方法检测浏览器可用的已安装字体的代码。（无 flash）。此代码是从 lalit.org/lab/javascript-css-font-detect 修改的。

 var Detector =
     {
       init: function()
    {
    this.h = document.getElementsByTagName("BODY")[0];
    this.d = document.createElement("DIV");
    this.s = document.createElement("SPAN");
    this.d.appendChild(this.s);
    this.d.style.fontFamily = "sans";
    this.s.style.fontFamily = "sans";
    this.s.style.fontSize = "72px";
    this.s.innerHTML = "mmmmmmmmmmlil";
    this.h.appendChild(this.d);
    this.defaultWidth = this.s.offsetWidth;
    this.defaultHeight = this.s.offsetHeight;
    this.h.removeChild(this.d)
   },
   test: function(a)
   {
    this.h.appendChild(this.d);
    var b = [];
    b.name = this.s.style.fontFamily = a;
    b.width = this.s.offsetWidth;
    b.height = this.s.offsetHeight;
    this.h.removeChild(this.d);
    a = a.toLowerCase();
    if (a == "serif") {
        b.found = true
    } else {
        b.found = (b.width != this.defaultWidth || b.height != this.defaultHeight)
    }
    return b
   },

   getFontList: function()
   {
    this.init();
    var a = ["cursive", "monospace", "serif", "sans-serif", "fantasy", "default",      "Arial", "Arial Black", "Arial Narrow", "Arial Rounded MT Bold", "Book Antiqua", "Bookman Old Style", "Bradley Hand ITC", "Bodoni MT", "Calibri", "Century", "Century Gothic", "Casual", "Comic Sans MS", "Consolas", "Copperplate Gothic Bold", "Courier", "Courier New", "English Text MT", "Felix Titling", "Futura", "Garamond", "Geneva", "Georgia", "Gentium", "Haettenschweiler", "Helvetica", "Impact", "Jokerman", "King", "Kootenay", "Latha", "Liberation Serif", "Lucida Console", "Lalit", "Lucida Grande", "Magneto", "Mistral", "Modena", "Monotype Corsiva", "MV Boli", "OCR A Extended", "Onyx", "Palatino Linotype", "Papyrus", "Parchment", "Pericles", "Playbill", "Segoe Print", "Shruti", "Tahoma", "TeX", "Times", "Times New Roman", "Trebuchet MS", "Verdana", "Verona"];
    var c = "";
    for (i = 0; i < a.length; ++i) {
        var b = this.test(a[i]);
        if (b.found) {
            c += b.name + ","
        }
    }
    return c.slice(0, - 1)
}
  };

请帮助我如何将 document.write() 用于显示字体列表。我只想在浏览器中打印那些字体列表文本。

【问题讨论】：

document.write(Detector.getFontList())
@OrangeDog 是的。我试过了。但它不起作用。请测试一下。
我已经完成了。它有效。
@OrangeDog 但我得到了空白页。可以发给我截图吗？
页面加载后您不能 document.write。它会擦除页面

标签： javascript

【解决方案1】：

DEMO

<div id="output"></div>

<script>
window.onload=function() {
  document.getElementById("output").innerHTML=Detector.getFontList();
}
</script>

我的盒子上的结果：

草书,等宽,衬线,无衬线,幻想,默认,Arial,Arial Black,Arial Narrow,Book Antiqua,Bookman Old Style,Calibri,Century,Century Gothic,Comic Sans MS,Consolas,Courier,Courier New, Garamond、Georgia、Helvetica、Impact、Jokerman、Latha、Lucida Console、Magneto、Mistral、Monotype Corsiva、Onyx、Palatino Linotype、Parchment、Playbill、Shruti、Tahoma、Trebuchet MS、Verdana

【讨论】：