Javascript 如何使浏览器等待资源加载?
我正在像javascript一样动态加载脚本和样式表 问题在于浏览器不会等待脚本加载 假设在名为script file.js的脚本文件中有一个名为functionToBeCalled()的函数 我有一个加载脚本文件的函数Javascript 如何使浏览器等待资源加载?,javascript,jquery,html,css,browser,Javascript,Jquery,Html,Css,Browser,我正在像javascript一样动态加载脚本和样式表 问题在于浏览器不会等待脚本加载 假设在名为script file.js的脚本文件中有一个名为functionToBeCalled()的函数 我有一个加载脚本文件的函数 <script type="text/javascript"> var listOfJavaScriptsLoaded = new Array(); function LoadScriptFile(scriptUrl){
<script type="text/javascript">
var listOfJavaScriptsLoaded = new Array();
function LoadScriptFile(scriptUrl){
var isScriptLoaded = false;
var i = 0;
for(i = 0; i < listOfJavaScriptsLoaded.length; i ++){
if(listOfJavaScriptsLoaded[i] == scriptUrl){
isScriptLoaded = true;
break;
}
}
if(isScriptLoaded == false){
var headTag= document.getElementsByTagName('head')[0];
var scriptTag= document.createElement('script');
scriptTag.type= 'text/javascript';
scriptTag.src= scriptUrl;
headTag.appendChild(scriptTag);
listOfJavaScriptsLoaded.push(scriptUrl);
}
}
LoadScriptFile("script-file.js");
functionToBeCalled();
</script>
var listOfJavaScriptsLoaded=新数组();
函数LoadScriptFile(scriptUrl){
var isscriptload=false;
var i=0;
for(i=0;i
现在,浏览器不会等待脚本标记加载,而是转到下一个命令。我得到一个“未定义的functionToBeCalled()”错误。这是很自然的。但事实是,当我在firebug中检查时,脚本标记已经形成,文件已经加载
那么,如何使浏览器在资源加载后暂停加载并继续
Edit1:仅当我在ajax中加载页面而不是在正常页面加载时,才会出现此问题
Edit2:或者是否可以从javascript中读取脚本/css文件,并将其直接写入脚本标记内的标记中
如果使用window.stop()加载将完全停止。我怎样才能使它从同一行恢复
或者是否可以让浏览器考虑加载还在发生,并在OnLoad事件中重置它?
< P>几乎每个加载资源的标签都有一个OnLoad事件。因此,在纯javascript中,这意味着在您的情况下如下所示:var s = document.createElement('script');
s.src = "script-file.js";
s.type = 'text/javascript';
head.appendChild(s);
s.onload = function(){
functionToBeCalled();
}
您可能有特定的理由动态加载脚本,但如果您在HTML输出中这样写出脚本元素,则要显示该选项:
<script src="script-file.js"></script>
<script>functionToBeCalled();</script>
函数becalled();
浏览器将停止解析,直到加载并解释该脚本
这也是有效的。请通过Getify Solutions查看LABjs()。LABjs允许同时加载脚本插入的脚本,但要按顺序运行。我建议查看。它将允许您尝试调用并以多种不同的方式查看它们在浏览器中的反应 这应该能回答你的问题。只需在页面加载
正文之前执行它即可
<script type="text/javascript">
var loadScriptFile = (function(){
var listOfJavaScriptsLoaded = [];
return function(scriptUrl){
var isScriptLoaded = false;
for(var i = 0; i < listOfJavaScriptsLoaded.length; i ++){
if(listOfJavaScriptsLoaded[i] == scriptUrl){
isScriptLoaded = true;
break;
}
}
if(!isScriptLoaded){
document.write('<scr' + 'ipt type="text/javascript" src="' + scriptUrl + '"></scr' + 'ipt>');
}
};
}());
loadScriptFile("script-file.js");
functionToBeCalled();
</script>
var loadScriptFile=(函数(){
var listOfJavaScriptsLoaded=[];
返回函数(脚本URL){
var isscriptload=false;
for(var i=0;i
为什么首先要以这种方式加载它们?是否绝对不可以将它们直接放入head标签或写出
标签?这会简单得多。@pekka:如果你是这样的话,我在哪里添加脚本标签也没什么区别pointing@ZX122R是的。如果您在正文中以普通的
标记写出来,页面的加载将等待脚本加载完毕。听Pekka的话,因为他是明智的。@Pekka:试过了。。似乎不起作用:(我如何告诉浏览器继续在onload事件中加载其他元素?@ZX12R这将自动发生。但是,IE似乎不支持脚本元素的onload
。请参阅此处了解解决方法:这是否与jQuery失败?根据labjs文档,与jQuery 1.3不兼容,但不兼容。)使用1.4看起来是一个很好的选择,除了我使用的许多插件还没有开始支持1.4之外(