Question

某些Web应用程序（我正在考虑Disqus和Disqus）通过Javascript创建<script>标记，并通过Javascript指定异步加载新脚本。他们为什么要通过Javascript创建标签？而不是简单地做：

<script src="..." async>

一个例子：

这就是Disqus指示网站所有者加载评论的方式：

<script type="text/javascript">
    var disqus_shortname = ...
    (function() {
        var s = document.createElement('script');
        s.type = 'text/javascript';
        s.async = true;
        s.src = '//' + disqus_shortname + '.disqus.com/embed.js';
        (document.getElementsByTagName('head')[0] ||
           document.getElementsByTagName('body')[0]).appendChild(dsq);
    })();
</script>

src = ...disqus.com/embed.js地址只是重定向到另一个Disqus服务器上的静态脚本，显然独立于 disqus_shortname 。

为什么不告诉人们使用这段代码：

<script>
    var disqus_shortname = ...
</script>
<script src="http://direct-address-to-the-embed.js-script" async>

甚至更简单，只需一行：

<script src="http://the_disqus_shortname.disqus.com/embed.js" async>

_{（P.S。我在下面添加了一个答案。请添加其他答案： - ））}

Answer 1

我可以想到一个不确定的（第1个）和两个可能的原因（第2和第3个）：

[编辑] 但是原因2和3是没有实际意义的点 - 不管我的理由2和3，都可以这样做：

<script src="http://the_disqus_shortname.disqus.com/embed.js" async>

<强> [/ Editi]

（也许不了解async属性的旧浏览器会完全忽略整个<script ... async>标记？而不是只忽略async并同步加载脚本？）< / p>
也许Disqus想要能够动态创建嵌入式脚本，或者重定向到不同的脚本，具体取决于网站设置（虽然看起来好像Disqus目前总是重定向到同一个总是embed.js脚本。无需用户重新配置他们的Disqus代码。
使用重定向允许Disqus告诉浏览器长时间缓存重定向的脚本，但同时可以快速重定向到另一个脚本。每次下载/从浏览器缓存中获取1次重定向。这在此建议：https://stackoverflow.com/a/10098250/694469

Answer 2

我的猜测是，Disqus（和其他服务）希望确保他们的脚本不会减慢用户站点的加载速度（可能很多CMS将脚本放在头元素中））。

如果您总是将脚本放在body元素的末尾，那么编写简短版本可能是最佳的：

    ...
    <script>var disqus_shortname = ...</script>
    <script src="//shortname.disqus.com/embed.js" async>
</body>

我不确定！

为什么要通过Javascript创建脚本标记，而不是使用延迟或异步脚本标记属性？

2 个答案: