我如何控制Javascript执行顺序? [英] How can I control Javascript execution order?

查看:109
本文介绍了我如何控制Javascript执行顺序?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在构建一个网页时遇到一些并发问题。基本上,我有三个脚本文件用于保存一些数据:

script1.js:

  var myValue = 1; 

script2.js:

  var myValue = 2; 

script3.js:

  var myValue = 3; 

我有一个页面, mypage.html ,基本上看起来像这样:

 < html> 
< script>
函数get_number()
{
var script_file = GetQueryStringValue(run);
e = document.createElement('script');
e.type ='text / javascript';
e.src = script_file +.js
head.appendChild(e);

document.write(myValue);
}
< / script>
< body onload =get_number()>
< div onclick =get_number()>点击我!< / div>
< / body>
< / html>

这个页面的主要思想是你可以像这样查询它:
mypage.html?run = script1
这将告诉 get_number()函数动态插入 script1.js 输入mypage.htm。然后,我调用 get_number()显示从脚本加载的值。



现在,按照上面的说法,我认为是相关的部分,显然我遗漏了一堆东西。我的实际代码加载了大量的值,而且更有趣......但是,我希望有人能够帮助我解决这个问题。



我是谁在Firefox,Chrome和Safari中,我得到一个错误消息: myValue 在IE中,数字显示正确。

c>未定义。但是,如果点击我创建的 Click me div,则数字将正确显示。所以,我知道我正确地加载了javascript外部文件。但是,它只是没有及时加载我的 get_number()函数正常工作 onload



现在,我对文件进行了一些修改,使得 get_number 函数看起来像这样:

 函数get_number()
{
var script_file = GetQueryStringValue(run);
e = document.createElement('script');
e.type ='text / javascript';
e.src = script_file +.js
head.appendChild(e);

setTimeout(function(){document.write(myValue),10});
}

setTimeout延迟足以让DOM更新并加载JavaScript在多数情况下。但是,这是一个彻头彻尾的破解。 Firefox往往会一直正确地加载这个改进的代码,而Chrome和Safari设法获得大约50%的时间价值。

所以,我想我'米想知道,有没有更好的方法来完成我在这里要做的事情?这是非常重要的,值是由外部驱动(通过查询字符串),但除了这个要求,我非常灵活。 解决方案

你可能会添加一个函数调用到你的脚本文件,这样当它们运行时,它们会调用这个函数来执行你的

  document.write(myValue); 

因此script1.js会是

  var myValue = 1; 
scriptLoaded();

,您的主文件将包含:

 函数scriptLoaded(){
document.write(myValue);
}


I'm having some concurrency issues with a webpage I'm building. Basically, I have three script files that I'm using to hold some data:

script1.js:

var myValue = 1;

script2.js:

var myValue = 2;

script3.js:

var myValue = 3;

And I have one page, mypage.html that basically looks like this:

<html>
<script>
   function get_number()
   {
     var script_file = GetQueryStringValue( "run" );
     e = document.createElement('script');
     e.type='text/javascript';
     e.src = script_file + ".js"
     head.appendChild( e );

     document.write( myValue );
   }
</script>
<body onload="get_number()">
   <div onclick="get_number()">Click me!</div>
</body>
</html>

The main idea with this page is that you would query it like this: mypage.html?run=script1 which would tell the get_number() function to dynamically insert script1.js in to mypage.htm. Then, I call get_number() to display the value loaded from the script.

Now, I've stripped down the above to what I think are the relevant parts and I've left out a bunch of stuff, obviously. My actual code loads a large array of values and is more interesting... But, I'm hoping someone can help me out with this regardless.

What I'm finding is that in IE, the number displays correctly.

In Firefox, Chrome and Safari, I get an error that myValue is undefined. However, if I click the Click me div that I created, the number displays correctly. So, I know I'm correctly loading the javascript external file. But, it just isn't loaded in time for my get_number() function to work correctly onload.

Now, I hacked up my file a little so that the get_number function looks like this:

 function get_number()
 {
   var script_file = GetQueryStringValue( "run" );
   e = document.createElement('script');
   e.type='text/javascript';
   e.src = script_file + ".js"
   head.appendChild( e );

   setTimeout( function() { document.write( myValue ), 10 } );
 }

The setTimeout delays enough for the DOM to be updated and the javascript to be loaded in most cases. But, this is a total hack. Firefox tends to load this 'improved' code correctly all the time while Chrome and Safari manage to get the value about 50% of the time.

So, I guess I'm wondering, is there a better way to accomplish what I'm trying to do here? It's very important that the value be driven externally (by the query string), but other than that requirement, I'm very flexible.

解决方案

Could you possibly add a function call to your script files, so that when they're run, they call the function that does your

document.write( myValue );

So that script1.js would be

var myValue = 1;
scriptLoaded();

and your main file would have:

function scriptLoaded(){
   document.write( myValue );
}

这篇关于我如何控制Javascript执行顺序?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆