Question

我想测量JavaScript中文本的大小。到目前为止，这并不是那么困难，因为我可以简单地将一个临时的不可见div放入DOM树中并检查offsetWidth和offsetHeight。问题是，我想在DOM准备好之前做到这一点。这是一个存根：

<html>
  <head>
    <script type="text/javascript">

    var text = "Hello world";
    var fontFamily = "Arial";
    var fontSize = 12;

    var size = measureText(text, fontSize, fontFamily);

    function measureText(text, fontSize, fontFamily)
    {
        // TODO Implement me!
    }      

    </script>
  </head>
  <body>
  </body>
</html>

再次：我知道当DOM（或正文）发出信号表示它已准备好时，如何异步进行。但我想在标题中同步执行它，如上面的存根所示。我有什么想法可以做到这一点？我目前的观点是，这是不可能的，但也许有人有一个疯狂的想法。

Answer 1

您不必等到整个DOM准备就绪，只需要等待它所需的部分。

将脚本移到<body>内。现在document.body存在，因此您可以document.body.insertBefore(myspan, document.body.firstChild)。（但不要appendChild，否则你将把一个元素放在解析器的顶部，这通常会破坏IE。）

可能有更复杂的解决方法（可能会使用画布和measureText()）但这是最简单的。

Answer 2

对不起，但没有疯狂的想法。当DOM没有准备好时，就不可能在它上面附加一个节点，所以你不可能在你想要的时候做你想做的事。

存在的事件越早并且告诉您dom已准备就绪是DOMContentLoaded事件，它在不同的浏览器实现中具有其他名称。

用JavaScript测量文本大小

2 个答案: