jQuery 从js文件调用函数到html页面
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15137611/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Calling functions from js file to html page
提问by
I have three js files for all of my webpages, and I have pre-defined sets of functions to call for each web page. Could I move all of these functions to a new js file which would make then calls to other functions in a different js file? I read about rloader at http://code.google.com/p/rloader/, but I am not sure if I could use it.
我的所有网页都有三个 js 文件，并且我有预定义的函数集来为每个网页调用。我可以将所有这些函数移动到一个新的 js 文件中，然后调用不同的 js 文件中的其他函数吗？我在http://code.google.com/p/rloader/ 上阅读了有关 rloader 的信息，但我不确定是否可以使用它。
<script src="js/rootNameSpace.js"></script>
<script src="js/jquery-min.js"></script>
<script src="js/ui.js"></script>
<script src="js/form.js"></script>
<script type="text/javascript">
console.dir(com);
com.rela.form.helloWorld1();
com.rela.form.helloWorld2();
</script>
采纳答案by Ben McCormick
Yes. If you move the contents of the script tag to a file with the path "js/main.js" and then added a script
是的。如果将 script 标签的内容移动到路径为“js/main.js”的文件中，然后添加了一个脚本
<script src="js/main.js"></script>
after the other scripts, it will be able to call the functions. Including an external script is equivalent to having the text from that script inline in the file.
在其他脚本之后，它将能够调用这些函数。包含外部脚本相当于将来自该脚本的文本嵌入到文件中。
Scripts can read the contents of previous scripts so having multiple scripts on the page is similar to concatenating them all into a single file, which means that if you add a script below the other scripts it will be able to "see" everything in the others
脚本可以读取先前脚本的内容，因此页面上有多个脚本类似于将它们全部连接到一个文件中，这意味着如果您在其他脚本下方添加一个脚本，它将能够“看到”其他脚本中的所有内容
With regard to questions about rloader
关于rloader的问题
rloader does lazy loading to pull in scripts when you need them.
rloader 执行延迟加载以在您需要时引入脚本。
For more on lazy loadingAnd you can learn about rloader from its site(I'm no expert on that)
有关延迟加载的更多信息， 您可以从其网站了解rloader（我不是这方面的专家）
For what its worth I would not recommend using rloader if you really only have 4 scripts on one page. Its overkill. If you're planning on having a much bigger project, then you can use it or the more popular requirejsto manage your scripts across pages.
如果您真的在一页上只有 4 个脚本，那么我不建议使用 rloader。它的矫枉过正。如果您打算拥有一个更大的项目，那么您可以使用它或更流行的requirejs来跨页面管理您的脚本。
回答by Waqar Alamgir
It is always better to put code in separate files (as far as they are less in size and count). This will allow to be cached by browser$(document).ready will keep you safe for other dom elements that are not loaded.
将代码放在单独的文件中总是更好（只要它们的大小和数量较少）。这将允许被浏览器缓存$(document).ready 将使您对其他未加载的 dom 元素保持安全。
Create something like this:
创建这样的东西：
<script src="js/rootNameSpace.js"></script>
<script src="js/jquery-min.js"></script>
<script src="js/ui.js"></script>
<script src="js/form.js"></script>
<script src="js/pages/some-page.js"></script>
some-page.js
some-page.js
$(document).ready(function(){
console.dir(com);
//call to function form.helloWorld1
com.relais.form.helloWorld1();
com.relais.form.helloWorld2();
});
A better option would be combine files (If they are common on each page). rootNameSpace.js, jquery-min.js, ui.js, form.js into a file say common.js. You can use Google Closureto do that.
更好的选择是合并文件（如果它们在每个页面上都是通用的）。rootNameSpace.js, jquery-min.js, ui.js, form.js 放到一个文件里说common.js。您可以使用Google Closure来做到这一点。
<script src="js/common.js"></script>
<script src="js/pages/some-page.js"></script>
回答by BG Adrian
If you have dynamic generated pages you can have different names/actions/controllers whatever. Then you can
如果你有动态生成的页面，你可以有不同的名称/动作/控制器。然后你可以
echo '<script type="text/javascript">$(document).ready(function(){'.$page_name.'();});</script>';
Then you can declare global functions in any JS file, yes you can have any number of JS files, and splited in any way you want, they are all global.
然后你可以在任何 JS 文件中声明全局函数，是的，你可以拥有任意数量的 JS 文件，并以任何你想要的方式拆分，它们都是全局的。
function name1(){...};
If you have a big application with many JS files you can split then into more files, in a single folder, then add a minify plugin to "collect" them in a single output file (or a JS builder).
如果您有一个包含许多 JS 文件的大型应用程序，您可以将其拆分为更多文件，在一个文件夹中，然后添加一个 minify 插件以将它们“收集”到单个输出文件（或 JS 构建器）中。
rloader is a dynamic loading script, basically Injects JS files in your document (http://ntt.cc/2008/02/10/4-ways-to-dynamically-load-external-javascriptwith-source.html). I don't recommend using it, except if you have a very big application and use a MVC http://coding.smashingmagazine.com/2012/07/27/journey-through-the-javascript-mvc-jungle/that loads only the current module.
rloader 是一个动态加载脚本，基本上是在你的文档中注入 JS 文件（http://ntt.cc/2008/02/10/4-ways-to-dynamically-load-external-javascriptwith-source.html）。我不建议使用它，除非您有一个非常大的应用程序并使用加载的 MVC http://coding.smashingmagazine.com/2012/07/27/journey-through-the-javascript-mvc-jungle/仅当前模块。
