Javascript 嵌入代码不会停止页面渲染答案

【问题标题】：Javascript embed code that doesn't halt page renderingJavascript 嵌入代码不会停止页面渲染
【发布时间】：2010-02-02 07:01:42
【问题描述】：

我想嵌入另一个页面的号码。远程调用很小（仅返回一个数字），但我希望页面在请求结束时继续加载。我该怎么做？我现在在做

<span id="target">Loading ...</span>
<script>
var cb = function(data) {
    document.getElementById("target").innerHTML = data; 
}
</script>
<script src="http://webnumbr.com/webnumbrs.latest.json(callback=cb)"></script>

我对客户端或服务器端的更改持开放态度。客户端嵌入的代码越少越好

【问题讨论】：

标签： javascript html ajax src

【解决方案1】：

“官方”建议（参见rules）是将所有 JavaScript 放在 HTML 文件的最底部。每个标签的内容将在渲染继续之前进行评估，因为脚本的结果可能会影响进一步的渲染（想想document.write()）。

【讨论】：

好吧，我给用户一些嵌入代码，所以让他们把一个放在他们想要嵌入的地方，另一个放在底部似乎不太好......

【解决方案2】：

老实说，

我认为最好的方法可能是简单地将其放入 onLoad() 指令中，这样它在文档完全呈现之前不会加载。这类似于 Tom 的回答，但在这种情况下，您将消除您遇到的大部分 DOM 问题。

【讨论】：

支持吗？我的功能在onLoad 吗？我一直回避那个标签，因为感觉不对……
它完全支持并推荐用于某些事情。任何会干扰页面呈现，或需要在启动前完全呈现页面的任何东西都是放入 onLoad 语句的好主意。 w3schools.com/jsref/event_onload.asp
支持onLoad()的元素很少。我可以做window.onLoad = function() { // stuff }吗？

【解决方案3】：

我相信您在加载当前页面时正在使用 AJAX 从其他页面加载内容，请确保您的 AJAX 调用是异步的，并且只有在成功完成后才更新“webNumbr_webnumbrs”控件。

【讨论】：

我应该如何确保它是异步的？我真的不想实例化 XMLHTTPRequest 对象，因为它会使客户端代码变得非常大。