Question

var Detector = function() {
    var baseFonts = ['monospace', 'sans-serif', 'serif'];
    var testString = "mmmmmmmmmmlli";

    var testSize = '72px';
    var h = document.getElementsByTagName("body")[0];

    // create a SPAN in the document to get the width of the text we use to test
    var s = document.createElement("span");
    s.style.fontSize = testSize;
    s.innerHTML = testString;
    var defaultWidth = {};
    var defaultHeight = {};
    for (var index in baseFonts) {
        //get the default width for the three base fonts
        s.style.fontFamily = baseFonts[index];
        h.appendChild(s);
        defaultWidth[baseFonts[index]] = s.offsetWidth; //width for the default font
        defaultHeight[baseFonts[index]] = s.offsetHeight; //height for the defualt font
        h.removeChild(s);
    }

    function detect(font) {
        var detected = false;
        for (var index in baseFonts) {
            s.style.fontFamily = font + ',' + baseFonts[index]; // name of the font along with the base font for fallback.
            h.appendChild(s);
            var matched = (s.offsetWidth != defaultWidth[baseFonts[index]] || s.offsetHeight != defaultHeight[baseFonts[index]]);
            h.removeChild(s);
            detected = detected || matched;
        }
        return detected;
    }

    this.detect = detect;
};
var d = new Detector();
alert(d.detect("Times"));

//从http://www.lalit.org/lab/javascript-css-font-detect/下载

这将通过间接影响方法检查系统上安装的fonts。不知何故，它首先在我的网页上完美运行。我添加了更多编码，现在它已经停止工作了。我已经删除了所有编码并将编码恢复到最初工作的编码，但它仍然无法正常工作。我已经尝试将其复制粘贴到其他一些页面，但它仍然没有在那里工作。但是当我将所有这些代码作为文本发布并在其上运行eval()时，它突然开始工作。我疯了。有人可以解决吗？

Answer 1

在CSS中使用字体回退会不会更容易？看起来好像很多JavaScript可以做一些CSS可以在一行中完成的事情。这是假设它是出于实用目的。

Answer 2

好吧我随机偶然发现了真正的问题。当我在我的javascript中使用DOM引用时，它一直发生在我身上。这是一件非常小的事情，而且很容易被忽视，但这就是让它变得更加烦人和难以捕捉的东西。

我在head标签之前的head部分使用了这段代码。从身体切割并在身体代码解决问题后粘贴它。原因似乎是因为此代码试图在body部分内创建span对象，所以在body标签最终之前使用此代码一个逻辑错误，因为到那个时候，身体对象不存在。将代码重新定位到正文部分之外可以解决问题并且代码现在可以顺利运行。感谢所有贡献者。

这个Javascript对象代码有什么问题？

2 个答案: