Document.ready在外部文件中？

Question

我引用JavaScript的HTML页面上进行如下：

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script> 
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&amp;region=GB"></script> 
<script type="text/javascript" src="js/shared.js"></script> 
<script type="text/javascript"> 
$('document').ready(function() { 
    // In-page code: call some functions in shared.js 
}); 
</script> 

在shared.js定义的函数不是包裹在里面$('document').ready。所以：

1. 它是安全的假设，在shared.js定义的函数都可以以“在页面代码”？

2. 如果我拉出在页面代码到名为local.js一个单独的文件（保持它包裹在$('document').ready），它仍然是安全的假设，在shared.js定义的功能有哪些？

3. 最后，是不是我在$('document').ready里面包装shared.js有问题？我发现如果我包装它，它的功能将不再可用于页内代码。

原因问题3的是，我打这个问题：Uncaught TypeError: Property ... is not a function - after page has loaded

，并想知道是否是与我是如何组织我的代码。

更新：感谢您的答案。现在很清楚，在shared.js中使用$('document').ready会从全局范围中删除这些函数。不过，我只是想澄清一点原来的问题3.

我可以假设，如果我做到以下几点：

• 内我的页面代码，里面装$('document').ready，调用从共享功能.JS
• 在shared.js功能是指jQuery的，谷歌地图，或元素在我的网页

不会有问题呢？

换句话说，假设页面在调用shared.js内部函数的时候已经加载，即使我没有在$('document').ready中包含该文件中的所有内容，也安全吗？

Answer 1

假设shared.js中定义的函数可用于“页内代码”是否安全？

是的，只要这些功能被注入到全球范围

如果我拉出在页面代码到一个名为单独的文件local.js（保持它包裹在$（'文件'）.ready），假设在shared.js中定义的函数可用，是否仍然安全？

是的，只要local.js之后shared.js和 shared.js包括注入功能整合到全球范围。

最后，事实是我没有将shared.js包装到$（'document'）里面。准备好了一个问题？我发现如果我包装它，它的功能将不再可用于页内代码。

document.ready中的环绕功能使它们在全局范围之外。

var foo = 4; // global 
$(function() { 
    var bar = 5; // local 
}); 
foo = bar; // error 

你需要注入在全球范围内的变量，这是因为这样做容易

$(function() { 
    /* all your code */ 

    window["SomeGlobalVariable"] = someFunctionIWantGlobal; 
}); 

Answer 2

1. 它是安全的假设（如果定义不隐藏封闭不能在里面访问）。

   //shared.js 
   function DoThis() {} 
   function DoThat() {} 
   

2. 它仍然可以工作，后shared.js

   <script type="text/javascript" src="js/shared.js"></script> 
   <script type="text/javascript" src="js/local.js"></script> 
   

3. 它没有工作只是嵌入local.js，因为这些功能都被包裹在一个闭包（将在domready中运行的一个），所以它们仅在关闭时可用

   $(document).ready(function() { //this is a closure! 
       function DoSg() {} 
       //DoSg is only available inside the closure 
       //cannot be accessed from the outside, it's defined inside 
   }); 
   

   此外，无需将函数定义放入$(document).ready()。重要的部分是当你调用这些函数，这应该在.ready()（嗯，如果它涉及DOM的东西或任何应该在页面加载后应该完成）。

Answer 3

最后的事实是，我在里面 $（ '文件'）。准备一个问题不 包装shared.js？我是 ，发现如果我包装它，其 函数不再可用于 页内代码。

如果你包里面的document.ready这些功能的功能都没有在全球范围内可用，功能具有本地范围（IE在那里它们被包含在函数内部）

Answer 4

1. 是
2. 是的
3. 也许吧。如果你在一个函数中包装代码，你将失去对定义函数的全局访问。大多数情况下这是一件好事 - 不会污染全局名称空间。您仍然可以在全局名称空间中访问这些函数，而不是function foo(){}，而是window.foo = function(){};。

但是，这一切都不相关，因为你需要一个dom准备好的监听器，或者你不需要 - 取决于你是否试图访问该代码中的dom。如果是的话，那就把它包起来，如果没有的话，那就不要。如前所述，无论哪种方式，您都可以关闭您的代码，以免污染全局名称空间，或者如果您愿意的话会污染它。

Answer 5

您的代码组织没有问题。在“共享”中定义的任何功能。JS”将提供给你的页面的其余部分，包括你的$('document').ready(function()块。

但是，如果您将功能shared.js 内阻断，那么你就限制了代码的范围为$('document').ready(function()（即无否则在页面中可以使用它） - 如果你想让“shared.js”中的东西可用于代码/应用程序的其他部分，那么这不是一种好的方法。