Javascript 外部JS实际上是如何加载到html中的?

Javascript 外部JS实际上是如何加载到html中的?,javascript,jquery,html,Javascript,Jquery,Html,我不知道我做得对还是错,我的理解不太清楚。我总是制作许多外部js文件,并将它们全部放在标题中。我所有的外部js文件都是这样开始的: $(document).ready(function(){ //all the functions and variables }); 例如,如果我有3个外部js文件: 一, 二, 三, 我从未尝试过使用其他JS文件中的变量和函数。是否可以在第三个JS文件中获取a和b变量 $(document).ready(function(){ //is it poss

我不知道我做得对还是错,我的理解不太清楚。我总是制作许多外部js文件,并将它们全部放在标题中。我所有的外部js文件都是这样开始的:

$(document).ready(function(){
  //all the functions and variables
});
例如,如果我有3个外部js文件:

一,

二,

三,

我从未尝试过使用其他JS文件中的变量和函数。是否可以在第三个JS文件中获取
a
b
变量

$(document).ready(function(){
  //is it possiblr to do this?
  alert(a+b);
  //or if I use run(), which methods will be called?
  run();
});

我很困惑。。。外部JS实际上是如何加载到html中的?或者我不应该把所有文件都准备好?现在,我想在一个脚本完全加载之后,一个一个地加载脚本,而不是同时加载一堆东西。因此,我必须首先明确说明。

每个文件都是独立的[他们不知道其中任何一个文件存在],因此他们会认为每个文件都需要
文档。如果脚本要求文档准备就绪,则准备就绪

最好将脚本包含在正文的末尾,而不是头部。看看这个问题:

有趣的是,您的示例会出现错误,因为变量的作用域是局部的。由于局部作用域的原因,变量
a
b
run
将在第三个文件中未定义。

高于$(文档)。在第一个文件中准备好将变量设为全局变量

var a;
var b;
无论是单独加载还是作为一个文件加载,javascript都没有区别,但通常最好将经常使用的脚本放在一个js文件中,而不是加载

现在我想一个接一个的加载脚本, 没有一堆东西同时加载


…这可能会变得更慢,因为你加载的更多。

将js代码放在不同的文件中不会有任何区别。 您可以认为这3个文件的结果将是一个具有此代码的单个文件

$(document).ready(function(){
 var a = 1000;
 function run(){alert(a)};
 $('#btna').click(function(){run();});
});

 $(document).ready(function(){
     var b = 2000;
     function run(){alert(b)};
     $('#btnb').click(function(){run();});
    });

 $(document).ready(function(){
       //is it possiblr to do this?
    alert(a+b); 
       //or if I use run(), which methods will be called?
    run();
 });
但在第三个代码段中,不可能执行
a+b
,不是因为它们不在单独的文件中,而是因为
a
b
在不同的函数上定义。JS具有功能范围。函数一终止,变量就被销毁

如果您想使用
a+b
只需将它们设置为全局(通过从它们中排除
var


e、 g.在第一个声明的Javascript文件中执行
var a=1000
,而不是执行
a=1000

您也可以在任何其他js文件包含之前添加以下内容

<script>
 var a;
 var b;
</script>

var a;
var b;

全局变量需要在顶部声明,以便JavaScript文件可以继续使用它们。

不要开始将变量放入全局范围。虽然这有时是必要的,但您最好使用以下内容在不同的作用域之间共享模块。通过使用模块和对象,您可以限制变量的作用域,并减少由于具有相同作用域的不同文件中定义的变量之间的冲突而导致错误的可能性。RequireJS还为您提供了一种管理依赖关系、异步加载javascript文件的方法,并提供了一种干净的方法来优化脚本(如果需要)

从学习的角度来看,正如其他人所指出的,您观察到的困难是由于变量的范围是在DocumentReady上运行的匿名函数的局部范围。在JavaScript中,使用
var
定义的变量的作用域位于包含代码块的本地。如果不使用
var
定义变量,那么它的作用域是全局的。应避免使用全局范围,以减少在多个位置意外重用变量的机会。一个好的经验法则是尽可能地限制范围,将其定义为使用它的地方的局部范围。如果一个变量必须全局共享,您可能应该将其定义为对象的属性并全局共享该对象。虽然对象是全局共享的,但对象上下文作为变量的作用域(如名称空间)发挥作用,因此,如果您为了不同的目的而意外地在其他地方重用它,则不太可能

例如:

<script type="text/javascript">
     var globalConstants = {
          a = 5,
          b = 10
     };
</script>

变量全局常数={
a=5,
b=10
};

然后,您可以稍后参考
globalConstants.a
globalConstants.b
-这使得您不太可能在不知道它们实际上是相同变量的情况下,在单独的脚本中意外重复使用
a
b

您是什么意思?例如,如果我删除了文件1中的document ready,我还能在js文件3中调用它吗,因为文件3中的document ready???如果在每个文件中执行的是jquery,那么在所有文件中都需要document ready。所以我可以在第三个js文件中调用a和b?但是,如果我在第二个js文件中再次声明b,它会覆盖第一个js文件吗?啊,我很困惑,还是说不同的js文件不能相互通信?不,函数外部的var使它是全局的。函数中的var使其私有。jquery()封装在函数中,因此在函数中声明它不应覆盖全局函数。使用它而不放置var将覆盖全局变量。除非我大错特错。只有外面的贴花才会是全球的。您可以在内部使用它们。是否可以在其他不同的js脚本中调用document ready函数中的特定函数?不可能?好的,我理解,所以只要在正确的位置调用它,它就会工作。哦,我想document.ready是相同的函数,所以它们会互相传递。。lol@Musa-在没有很好理由的情况下使变量成为全局变量是一个坏习惯,并且不可避免地会由于意外重用变量而导致错误。
<script>
 var a;
 var b;
</script>
<script type="text/javascript">
     var globalConstants = {
          a = 5,
          b = 10
     };
</script>