7

我在某个未命名的供应商文档中看到了此代码示例。它似乎异步加载脚本，然后从它调用一个函数。我意识到 if-undefined 检查将防止出现明显错误，但这不是完全不正确吗？

我相信在 IE8/9 中它会正常工作，但会阻止执行，直到 LOADER_URL 脚本加载并执行；而且我相信在许多其他支持异步属性的浏览器中，这只会导致内联块仅在部分时间执行 if 块内的代码。文档指出“标签是异步的，不会减慢页面的加载速度。”

<script type="text/javascript" src="LOADER_URL" async="true"></script>
<script type="text/javascript">
if (typeof (OBJECT_DEFINED_IN_LOADER_URL) != "undefined") { OBJECT_DEFINED_IN_LOADER_URL.Load(false); }
</script>

查看他们文档的早期版本，它没有 async 属性的建议，也没有提出此要求。是否有一些技术作家犯了错误并说“是的，那会工作”而没有在所有浏览器中进行充分测试？在 IE <= 9 中它会一直工作。而且由于异步代码调试起来非常有趣……也许它对他们有用……

这是我的怀疑:)

4

5 回答 5

13

你怀疑是对的。几乎可以保证发布的代码不会在支持 async 属性的浏览器中按预期工作。

基本上有3种“模式”：

  1. 如果存在 async 属性，则脚本将在可用时立即异步执行。
  2. 如果 async 属性不存在但 defer 属性存在，则在页面完成解析后执行脚本。
  3. 如果两个属性都不存在，则在用户代理继续解析页面之前立即获取并执行脚本。

来源：http ://www.w3.org/html/wg/drafts/html/master/scripting-1.html

注意： async 属性值被忽略，该属性的存在表明脚本应该异步执行。因此将值设置为 false 仍然与将其设置为 true 相同。

于 2013-05-08T07:37:33.483 回答
4

如果异步为真

脚本将尽快下载并执行，同时解析 HTML 页面

如果 async 为假

脚本下载和执行的过程将在开始任何 HTML 页面解析之前执行，因此 HTML 解析将在首先下载和执行脚本时停止。

于 2013-05-08T08:06:39.297 回答
3

“async=true”，当浏览器支持时，基本意思是：浏览器将异步加载脚本，并在它喜欢的时候执行它。
所以没有保证第二个脚本将在第一个脚本之后执行。

只有在页面中没有任何其他代码直接使用您在异步脚本中加载的对象时，您才能安全地使用“异步 js 加载”。

我有这一切的证据，因为我在我的一个项目中犯了类似的错误，但通过 fiddler 或类似的东西复制并不容易。

因此，问题中提出的代码有时会起作用，有时不会。

于 2013-05-08T07:16:32.883 回答
1

如此处所述，它是 HTML5 中的新功能：由 'async' 分配的异步属性作为其值 指定异步执行的脚本（仅适用于外部脚本）。

到目前为止，我发现在我的网站上使用此代码在任何浏览器中调用外部脚本都没有问题：

function include(src, attr, value)
{
    var head = document.getElementsByTagName('head')[0];
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.setAttribute(attr, value);
    script.async = 'async';
    script.src = src;
    head.appendChild(script);
}

include('LOADER_URL', 'custom-attr', 'custom-value');
于 2016-02-12T19:15:20.030 回答
0

这是否有意义在很大程度上取决于代码的结构。

您必须记住，浏览器会缓存某些文件（包括脚本）。您的脚本似乎是某种按需加载所需资源的库（可能类似于require.js），因此如果浏览器将所有内容都缓存在缓存中（= 对象已经存在），则此异步代码可能非常有意义只是中断加载过程。

于 2013-05-08T09:31:19.677 回答