在Javascript（js）文件中加载jQuery

这是一个非常简单的脚本，应该加载jQuery。我可以在jQuery是加载Firebug的脚本选项卡看到，但我得到“当我尝试使用$没有定义”的错误。谁能帮我明白了什么是错的？在Javascript（js）文件中加载jQuery

//function to add scripts 
function include(file) 
{ 
    var script = document.createElement('script'); 
    script.src = file; 
    script.type = 'text/javascript'; 
    script.defer = true;  
    document.getElementsByTagName('head').item(0).appendChild(script); 
} 
//add jQuery 
include('https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'); 

//See if jQuery is working 
$(document).ready(function() { 
    $('#internal').show(); 
}) 

//////////// 
//RETURNS: "$ is not defined $(document).ready(function() {"

奇怪的是，如果唐“T尝试使用jQuery在这同一个脚本，而不是我加载使用jQuery的另一个js文件它的工作

//function to add scripts 
function include(file) 
{ 
    var script = document.createElement('script'); 
    script.src = file; 
    script.type = 'text/javascript'; 
    script.defer = true;  
    document.getElementsByTagName('head').item(0).appendChild(script); 
} 
//add jQuery 
include('https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'); 

//add my custom script that wants to use jQuery 
include('scripts/testScript.js')

testScript.js

$(document).ready(function() { 
    $('#external').show(); 
})

我很欣赏这个任何建议。

来源

2010-11-19 maestrojed

我猜这是因为浏览器将只执行完成执行当前文件后添加的脚本节点中的JavaScript。

浏览器将在一个线程中执行当前脚本。当它到达脚本的末尾时，它会执行DOM中的下一个脚本。它不能停止通过一个脚本运行以跳到下一个脚本。

您可能想看看Google的JavaScript loader。工作的方式是，你告诉它加载一个外部的js文件，并注册一个回调，以便在加载该文件时执行。

你可以用回调来做，因为回调中的代码只有在浏览器完成当前文件的执行并转移到下一个文件后才能执行。你的不能让做的事情是让浏览器从一个js文件切换到另一个（即当它首次执行文件内容时）。

来源

2010-11-19 17:56:34 Skilldrick

+1 - 你需要使用该脚本的' onload'处理程序来触发回调。 – user113716 2010-11-19 18:13:19

当你像你一样动态添加一个脚本文件时，该文件不会被执行，直到你的javascript的其余部分被执行;因此在示例中，一个jQuery源被压低到jQuery代码下面，因此返回undefined。

原因代码示例两个作品是因为您有两个动态添加的文件，并将它们按顺序添加到底部，所以执行jQuery源代码，然后执行您的jQuery代码。

来源

2010-11-19 18:02:28 Moses

所以，通过使用JavaScript来加载jQuery，你是异步加载文件。你的代码将开始加载jQuery，然后继续调用你的document.ready代码，这将失败，因为jQuery尚未完成加载或开始执行。

当你使用两个include时，它会加载每个文件，等到第二个文件被执行时，第一个文件已经被执行，这就是它的工作原理。

您确实需要设置一个回调函数，以便一旦jQuery完成加载，它将执行文档就绪任务以及运行任何需要jQuery的其他代码。

来源

2010-11-19 18:02:35

正如其他答案中所解释的，jquery是异步加载的，因此在调用$（document）.ready（）时，jquery是net加载的。

function include(file){ 
    var script = document.createElement('script'); 
    script.src = file; 
    script.type = 'text/javascript'; 
    script.defer = true; 
    script.onload= function(){ 
     $(document).ready(function() { 
     //your code here 
     }) 
    } 
    document.getElementsByTagName('head').item(0).appendChild(script); 
} 
//add jQuery 
include('https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js');

看看这里的一个例子：：您可以通过添加自己的代码，脚本元素的onload事件处理避免这种 http://jsfiddle.net/CrReF/

来源

2010-11-19 18:07:46 Simon

在Javascript（js）文件中加载jQuery

回答

相关问题