内联Javascript：这是一个好习惯吗？

Question

我有很多视图模板，其中我有特定于该视图的内联JavaScript。

例如：

app/views/something/index.html.haml
.some-id
  %h4 Something

#this javascript is not reused anywhere. Used only in this view
:javascript
  $(document).ready(function() {
    $('.some-id').addClass('something')
  })

获得上述观点是一种好习惯吗？

在多个视图中维护内联javascript绝对是一种痛苦。所以我开始慢慢将它们移动到一个单独的javascript文件中。但我不确定这是否是一件好事，因为现在所有的javascript都将被执行。

哪个是放置视图特定javascript的最佳位置？

Answer 1

如果您担心页面加载时间，则应使用loadjs之类的内容。在这样的视图中放置JS是不可维护的。对于超级简单的项目，也许，但一般来说，你应该远离它。

另外需要注意的是，浏览器会在从文件加载javascript时缓存它们。它们在内联时无法执行此操作，因为每次页面加载都会呈现HTML。因此，即使没有loadjs，你可能正在考虑内联时的整体性能损失。

Answer 2

通常，我对此事的看法......

就外观和可用性而言： 如果可以在多个位置重用代码，则应将其重新分组为函数。可以调用此函数并减少文档中的代码行。这样可以提高编写代码所需的时间，也可以使您的最终结果更整洁，更易于维护。

就加载页面的效率而言： 我不认为你应该每次加载页面时调用所有的javascript。而不是将您想要在函数中重用的所有内容放入另一个文档中，而是考虑将其中的一些内容分组到文档的头部。基本上它只是做一个javascript包含没有什么不同，但是如果你使用那个大的javascript文件作为你网站上所有页面的库，那么你可以通过放置你需要的功能来削减一些代码在文件的头部。

编辑：为了更直接地回答您的问题，我相信人们普遍认为内联javascript始终是一种不好的做法。

我不是一直相信这是真的。我会说在维护其他代码的时候我不介意他们是否使用内联，外部文件，或者只要它们只是一致就定位在头部。