JavaScript 加载顺序

IT技术 javascript google-maps activemq
2021-02-25 02:44:51

我正在使用amq.js (ActiveMQ) 和Google Maps我按这个顺序加载我的脚本

<head>
    <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
    <title>AMQ & Maps Demo</title>

    <!-- Stylesheet -->
    <link rel="stylesheet" type="text/css" href="style.css"></link>

    <!-- Google APIs -->
    <script type="text/javascript" src="http://www.google.com/jsapi?key=abcdefg"></script>

    <!-- Active MQ -->
    <script type="text/javascript" src="amq/amq.js"></script>
    <script type="text/javascript">amq.uri='amq';</script>

    <!-- Application -->
    <script type="text/javascript" src="application.js"></script>
</head>

但是,在我的 application.js 中,它可以很好地加载地图,但是在尝试使用 AMQ 订阅主题时出现错误。AMQ 依赖于 Firefox 中的错误控制台说对象未定义的原型。我想我在脚本完成加载之前使用 amq 对象有问题。有没有办法确保在我在 application.js 中使用它们之前加载两个脚本?

谷歌有这个很好的函数调用google.setOnLoadCallback(initialize);,效果很好。我不确定 amq.js 有没有这样的东西。

6个回答

跨域脚本是在站点本身的脚本之后加载的,这就是您出错的原因。有趣的是,这里没有人知道这一点。

刚刚在最新版本的 Chrome 和 Firefox 中对此进行了测试,但两者都不是。它也与 MDN 相矛盾(参见developer.mozilla.org/en/docs/Web/HTML/Element/script)。-1; 你没有为你的主张提供任何证据,我不相信这是真的。
2021-04-25 02:44:51
这里是否有错误(stackoverflow.com/questions/1307929/...)在“考虑者的好答案”中:“Javascript 保证按照它在 HTML 中出现的顺序运行,所以请确保在尝试之前定义您的函数将其附加到事件中。”?
2021-04-30 02:44:51
这似乎不可能,因为从 Google 的 CDN 加载 jQuery,然后拥有自己的需要 jQuery 的本地脚本是相当普遍的做法
2021-05-07 02:44:51
谢谢你的评论。将我的脚本移动到同一个域后,不再有问题。
2021-05-08 02:44:51

有没有办法确保在我在 application.js 中使用它们之前加载两个脚本?

JavaScript 文件应该按顺序加载并阻塞,因此除非您依赖的脚本正在做一些不寻常的事情,否则您需要做的就是在其他文件之后加载 application.js。

Non-blocking JavaScript Downloads有一些关于脚本如何加载的信息(并讨论了一些颠覆阻塞的技术)。

还值得查看异步module定义API 和其他对并行加载 JavaScript 文件和其他资源执行相同操作的其他 API。
2021-05-03 02:44:51

在 jquery 中,您可以使用:

$(document).ready(function(){/*do stuff here*/});

这可以确保在做你的事情之前加载了 javascript 并且 dom 已经准备好。

在原型中看起来这可能有效

document.observe("dom:loaded", function() {/*do stuff here*/});

如果我正确理解您的问题.. 我认为这可能会有所帮助..

如果您不想依赖库来执行此操作...我认为这可能有效:

<script>
   function doIt() {/*do stuff here*/}
</script>
<body onLoad="doIt();"></body>
它是否确保加载了 javascript 和 dom,或者只是 dom?
2021-05-14 02:44:51

我有一个类似的问题,只有一个脚本。我想出的解决方案是使用创建addEventListener("load",fn,false)script对象document.createElement('script')Here is the final function 它加载任何标准 JS 文件并让您添加“后加载”脚本。

function addJavaScript( js, onload ) {
   var head, ref;
   head = document.getElementsByTagName('head')[0];
   if (!head) { return; }
   script = document.createElement('script');
   script.type = 'text/javascript';
   script.src = js;
   script.addEventListener( "load", onload, false );
   head.appendChild(script);
}

我希望这可以在将来对某人有所帮助。

有没有办法确保在我使用它们之前加载两个脚本?

是的。

把你想最后加载的代码(你的application.js东西)放到原型的document.observe 中这应该确保代码仅在原型 + 其他内容完成并准备就绪后加载。(如果你熟悉 jQuery,这个功能类似于 jQuery 的$(document).ready