在Chrome中按顺序加载脚本

我有一个外部脚本，后面跟着我的<body>底部的内联脚本。它看起来像脚本在外部脚本，这是不应该发生之前运行的内联，根据这样的回答：在Chrome中按顺序加载脚本

如果没有动态加载脚本或将它们标记为延迟或异步，然后脚本按页面中遇到的顺序加载。无论它是外部脚本还是内联脚本 - 它们都按页面遇到的顺序执行。内部脚本之后的内联脚本一直保存到之前的所有外部脚本已加载并运行。

的Src：https://stackoverflow.com/a/8996894/114855

这是我的代码：

<script src="https://checkout.stripe.com/checkout.js"></script> 
    <script> 
    var handler = StripeCheckout.configure({ 
    key: 'pk_live_HhFqemZFyEUJVorFzYvjUK2j', 
    token: function(res) { 
     $('#pay_token').val(res.id); 
     $('#pay_email').val(res.email) 
     $('#pay_amount').val(parseFloat($("#amount").val())*100); 
     $('#pay_description').val($("#description").val()); 
     $('#pay_real').submit(); 
    } 
    }); 

    /* .. */ 
    </script> 

</body>

控制台是表示StripeCheckout没有定义（其外部脚本应该定义）

这是有道理的，因为网络选项卡显示我的外部最终请求仍在等待中。但我不知道为什么浏览器没有等待checkout.js是牵强：

Network

来源

2015-04-22 Colin

将外部文件加载到文档的“头部” – APAD1

在报价问题两个答案的评论表明，接受的答案不是由标准的支持参考（适用于所有常见的浏览器版本），并且在所有浏览器中都可能并非如此。

我可以证实这种行为。但是我们的反馈页面上有提示，它可能只在test.php被缓存时才起作用。你知道关于这个的任何规范/参考链接吗？

这个答案不正确。 “动态添加的脚本一旦被附加到文档后就立即执行”并非总是如此。有时候这是真的（例如对于旧版本的Firefox），但通常情况并非如此。正如jfriend00的回答中提到的执行顺序不是确定的

要完全安全，请等到DOM is fully rendered再运行脚本。

来源

2015-04-22 01:05:05

不对HTML5的建议（http://www.w3.org/TR/html5/scripting-1.html）确定脚本执行顺序？ – Leo

@Leo：每个经常遇到的浏览器都实现html5规范吗？ –

可能不是。 :-( - 虽然这里有趣的事情是Chrome不知怎的错过了它，看看这个规范说的是“每个带有src属性的脚本元素”。有点误导我认为。 – Leo

艾哈 - 我已经想通了！

这是运行TurboLinks的Rails应用程序的一部分。

TurboLinks动态更改主体内容，而不是每次点击链接时都创建新的请求。这意味着我的脚本标签被动态地插入，并保证它们按顺序运行。

由于TurboLinks在每次请求不重新评估脚本标记，我认为最简单的/最佳这里的解决方案是包括我的应用程序的每一个页面（不只是它需要对一个人的）上StripeCheckout，内<head>

我也认为TurboLinks可以通过找到一种按顺序运行脚本的方法来解决这个问题。我打算跟进一个关于他们的github的问题，并会相应地在这里更新。

来源

2015-04-23 18:57:28 Colin

在Chrome中按顺序加载脚本

回答

相关问题