我在 body 标签中有一个脚本。问题是有些代码在完成之前就被加载了,即使它在文档就绪 block 中也是如此。 ready block 中的代码不应该等待 script 标签中的代码完成吗?或者它只是推迟到呈现脚本标签但不执行?
<html>
<head>
<script data-main="script.js" src="/assets/js/require.js"></script>
</head>
<body>
<script type="text/javascript">
var foo = ${fromServer};
</script>
</body>
</html>
script.js:我希望这会等到脚本完成...
$(function() {
// access script var from here, not set yet hmmmm
});
我很想知道这里发生了什么......
更新:
现在好了,这是来自页面的变量
require.config({
baseUrl: '/assets/js/app',
shim: {
d3: {
exports: 'd3'
},
underscore: {
exports: '_',
},
backbone: {
deps: ['underscore', 'jquery'],
exports: 'Backbone'
},
uidate: {
deps: ['jquery']
}
},
paths: {
d3: '../lib/d3.v3',
jquery: '../lib/jquery-2.0.3.min',
underscore: '../lib/underscore',
backbone: '../lib/backbone'
}
});
require([...], function(...) {
//console.log here and foo is set and good to go
var myCollection = new MyCollection(foo);
在我的收藏中:
// define(.... {
// var coll = Backbone.Collection.extend({
initialize: function() {
console.log(this);
}
看着我看到的控制台:
{length: 0, models: Array[0], _byId: Object, constructor: function, model: function…}
当我在 Chrome 控制台中展开对象时,实际上那里有模型......很奇怪。如果我在 init 和 console.log(this)
中再次执行 setTimeout,则模型已设置。初始化模型的延迟从何而来?
我也试过只加载一个数组,比如:
var someColl = new MyCollection([ { ... }, { ... } ]);
同样的问题。
更新:我试图缩小问题的范围,console.log 在这里打印一个空数组
var testing = [{x:1,d:2},{x:3,d:8},{x:3,d:98}];
var myCollection = Backbone.Collection.extend({
initialize: function() {
console.log(JSON.stringify(this));
}
});
var x = new myCollection(testing);
最佳答案
jQuery ready 在调用其回调之前等待 DOM 完成加载。这将大致相当于 </body>
时的情况。标记被解析并且它前面的所有内容(包括任何脚本)都已经被解析。未标记为 defer
的脚本或 async
将已经运行。
您的问题并不完全清楚您的问题到底是什么,但是 jQuery 就绪 block 中的代码将在 <head>
中的其他脚本之后执行。或 <body>
被执行。
如果您使用 require.js 库异步加载脚本,那么这些脚本可能会在文档准备好之前或之后加载,具体取决于文档加载中发生的其他情况。如果您需要协调异步加载这些脚本的时间,那么您将必须使用 require.js 库中的功能来了解这些脚本何时加载或在这些脚本中使用 document.ready 以确保它们等待用于解析文档的其余部分。
关于javascript - 在正文中加载脚本的顺序并使用 jquery ready,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21949620/