在HTML文档中插入JavaScript的最佳位置

Best place to insert JavaScript within a HTML document

本问题已经有最佳答案,请猛点这里访问。

Possible Duplicate:
Where is the best place to put tags in HTML markup?

我应该在哪里放置javascript代码?

1
2
3
4
5
  <-- Here?
</body>
  <-- Here?
</html>
  <-- Here?

我一直在之上使用,只是想知道这是"最好的"


如果JavaScript需要在整个页面加载之前准备就绪,那么将它放在之间。如果JavaScript需要在用户在页面上遇到某些内容之前就可用,那么可以将它放在中的元素之前(尽管人们很难为代码可读性做到这一点)。如果JavaScript只是做了一些增强或提供跟踪信息(这不是必需的),你可以在之前把它放好。


协商一致似乎是有两个合理的地方放置脚本:

  • 部分:

    • Pro:脚本在内容之前加载,因此可以在用户与页面交互之前应用动态行为。
    • Con:用户必须等待脚本下载和应用,这可能导致更高的跳出率和通常较差的性能。
  • 就在标签之前:

    • Pro:内容已尽快加载并可供用户看到。
    • Con:动态行为,效果等不会立即应用。
  • 您需要确定您的优先级是什么以及您的具体需求是什么。就个人而言,我会对中页面的正常运行以及最后的渐进增强功能提出任何绝对关键的内容。


    之后放置将无效,我不确定它会完成什么。建议将某些脚本(例如,用于分析服务)加载到正文末尾(在之前),因为它们会同步加载并可能会挂起页面。


    真的取决于你想要做什么。

    一般的经验法则是让您将javaScript代码放在一个单独的文件中,并将该脚本链接到这样的东西

    1
    <script type="text/javascript" src="your/source/here.js">

    然后,让您的脚本内嵌在页面中,您可以将它放在您想要的位置。在页面的head部分中,它会预先加载,因此可以根据需要进行预处理。如果你有它,让我们说在页面的body部分,它将加载页面的正常流程。

    将所有内容放在同一个文件中,我将在head中使用该脚本,如果需要,然后在body中调用函数。

    希望这可以帮助。

    编辑

    请记住,主要目标应该是代码的可读性和可重用性。因此,无论以最有效的方式实现这一点,我都不得不说是最好的方式。


    不要认为它几乎与代码中的位置一样多,它是如何处理检查是否可以在触发时运行代码。即onload或onready。

    HTML5样板文件促使大多数(如果不是所有)脚本成为正文中的最后一个元素,但是我还没有时间对它进行基准测试而不是将其置于头部。


    内部内部

    也就是说,从那里它有时只是偏好。许多人在文档的最后说,因为有一个假设的速度增加。如果它在那里,它是微不足道的。


    JavaScript可以添加到任何地方。在你学习的过程中,这只是一个基本的例子。

    1
    2
    3
    4
    5
    6
    7
    <html>
    <head>
    ----- Your Javascript here -----
    </head>
    <body>
    </body>
    </html>

    如果你把javascript代码放在 // javascript code here 里面会更好
    因为在页面出现之前会加载头部分。