我想尽可能地将我的JS代码与HTML分开，我可以看到几种模式。
1）我可以使用
$(document).ready(function() {...})
在关闭正文标记之前
2）我可以把js代码放在
中new FormValidationHandler()
3）我可以指向包含$（document）ready的初始化的外部js文件或脚本标记中的新FormValidationHandler
4）还有一种方法可以使用自我调用函数，但不知道它是否映射到这个问题
我的问题是首选哪种方式？
第二个是我可以将外部脚本放入网页的两个地方：
head应该只包含不必在页面加载时运行的代码吗？然后该代码应放在正文中？
答案 0 :(得分：0)
我喜欢这样做。它可能并不完美，但我喜欢这样：
每个脚本都在HTML文档末尾加载，就在结束主体之前。
有一个例外：处理FOUC的脚本（例如，modernizr）。这个脚本必须在头脑中。 我没有看到任何其他合理的例外情况。
他的两个案例，在我看来：如果你使用超文本文档或网络应用程序（也许这可能需要更多的解释，但它会很长：p）。我很少为网络应用程序工作，所以我还没有一个经过验证的组织。但我认为在Web应用程序中，您可以使用一些脚本加载库，如requirejs，它可能比简单的网页更有用。
对于超文本文档（大多数网页），我喜欢区分两种类型的脚本：库和我在法语中使用的“script d'interfaçage”（“链接脚本”可能是一个很好的翻译...）
正如名称所示，库是在javascript环境中加载库的脚本，但不做任何事情。
链接脚本用于将这些库链接到特定的HTML文档。
对于我来说，在一个完美的世界中，应该有尽可能多的库脚本，但每个HTML文档只有一个链接脚本。在这个脚本中，如果你使用的是jQuery，你会发现$（document）.ready调用，这个脚本的所有内容应该非常简单。理想情况下，在文档就绪函数中，应该只有如下指令：
$('my selector').MyPlugin({
option1:'value',
option2: 'value'
});
这种类型的指令实际上是HTML文档和JS库之间的简单链接，阅读和理解非常简单。
在这个组织中，你可以做任何类型的打包来减少要加载的js文件的数量。此包装必须针对客户端缓存和限制HTTP请求等进行优化...
就个人而言，我更喜欢对所有脚本使用外部文件，但通常我会使用一个内联脚本标记来声明某些库所需的一些变量（您的广告服务的密钥等等）。
最后一个特例：当您必须从其他主机加载脚本时。一般情况下，您无法判断脚本是否会加载，因为您无法判断其他服务器是否启动，以及它是否会缓慢或快速...您无法准确判断脚本是什么会这样做，所以它可能会打破你的页面......
从其他主机加载脚本确实会产生问题，这就是为什么我建议在页面完全加载后异步加载它们，尽可能多地控制它们。
为此，我亲自开发了一个专门用于加载库的库（也许有一天我会在gitHub上发布它，当我有时间）。 例如，我使用此脚本加载Facebook google + ou twitter API，或任何其他外部库，如统计信息或广告服务。