0

我试图通过使用多个专注于某些特定任务的 javascript 文件来分离我的应用程序的逻辑。

JSfiles 中定义的函数需要在文件本身之间进行访问。

我知道调用函数的顺序很重要，定义“全局”与“本地”范围很重要。在以下文件中，文件未包装在函数中，因此我认为它们在全局范围内。

文件1.js 

function addingToDOM(stuff) {
...  
...
}

文件2.js 

// call addingToDOM
addingToDOM(someStuff);
function doOtherTHings() {
...
...
}

HTML（文件顺序） 

<script src="file1.js"></script>
<script src="file2.js"></script>

错误
addingToDOM is not defined

file2.js在 HTML 中调用file1.jsafter 。 我不明白为什么它没有定义。 file1.js

4

3 回答 3

3

您的 JS 文件应该只定义函数并调用同一个 JS 文件中的函数。如果要从另一个 JS 文件中调用函数，则需要先加载该 JS 文件。我会将所有调用代码（有点像其他语言（如 C）中的“主”函数）放在一个地方，最好放在 html 文档的末尾。毕竟，加载了其他 JS 文件（和标记）。这并不是说您不能从 file2 调用 file1 中的函数，而是它们都应该在您的代码开始运行之前完全加载。

您的设置应该按原样工作，但请确保调用第一个需要运行的函数，而不是从 JS 文件中，而是在 HTML 文档的末尾。

于 2013-01-19T22:14:11.173 回答
1

问题看起来像在脚本标签中引用您的 src 属性。在 HTML 中试试这个：

<script src="file1.js"></script>
<script src="file2.js"></script>
于 2013-01-19T22:17:22.123 回答
1

也许你正在寻找类似的东西require.js：它让你可以轻松地管理多个 JS 文件之间的依赖关系，通过指定模块的加载顺序等。

http://requirejs.org/

除此之外，建议在生产环境中只包含一个包含所有代码的 JavaScript 文件（第 3 方库通常仍然是独立的） - 然后可以缩小此文件，从而使其比多个文件更小、下载速度更快。但这在开发过程中并不重要，您应该意识到这一点。

编辑：顺便说一句，require.js还提供了一种简单的方法来从所有模块中生成单个缩小文件以进行生产。

于 2013-01-19T22:19:23.717 回答