我应该把我的 JavaScript 代码放在哪里？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4647806/
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
Where should I put my JavaScript code?
提问by Roman
I would like to use the code for the auto-complete. The code is here.
我想使用自动完成的代码。代码在这里。
<script>
$(function() {
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$( "#tags" ).autocomplete({
source: availableTags
});
});
</script>
<div class="demo">
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags">
</div>
</div><!-- End demo -->
<div class="demo-description" style="display: none; ">
<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are tags for programming languages, give "ja" (for Java or JavaScript) a try.</p>
<p>The datasource is a simple JavaScript array, provided to the widget using the source-option.</p>
</div><!-- End demo-description -->
However, I cannot figure out where I should put this code. In head? In body?
但是，我不知道应该把这段代码放在哪里。在头上？在体内？
回答by Shervin Asgari
According to w3schools
When to put script in HEAD
何时将脚本放入 HEAD
Scripts to be executed when they are called, or when an event is triggered, are placed in functions. Put your functions in the head section, this way they are all in one place, and they do not interfere with page content.
调用脚本或触发事件时要执行的脚本放置在函数中。将您的功能放在 head 部分，这样它们都在一个地方，并且不会干扰页面内容。
When to put script in BODY
何时将脚本放入 BODY
If you don't want your script to be placed inside a function, or if your script should write page content, it should be placed in the body section.
如果您不希望将脚本放置在函数内，或者您的脚本应该编写页面内容，则应将其放置在正文部分中。
So in your case. You can put the script in the body
所以在你的情况下。你可以把脚本放在body
回答by Yoh Suzuki
You should probably put your code right at the end of the body tag.
您可能应该将代码放在 body 标签的末尾。
Check out Steve Souder's High Performance Web Sites - Evolution of Script Loading
查看Steve Souder 的高性能网站 - 脚本加载的演变
If you have multiple script includes and need to convince yourself that they will load in the correct order for you, check out WebSiteOptimization.com's Article on the Defer Attribute, where you can see the order your scripts execute.
如果您有多个脚本包含并且需要说服自己它们会以正确的顺序为您加载，请查看WebSiteOptimization.com 关于 Defer 属性的文章，您可以在其中查看脚本执行的顺序。
回答by Crozin
Put it into external file and then link that file with HTML document using:
将其放入外部文件，然后使用以下命令将该文件与 HTML 文档链接：
<head>
...
<script type="text/javascript" src="/scripts/my-script.js"></script>
</head>
(if you're using HTML5 you can skip typeattribute).
（如果您使用的是 HTML5，则可以跳过type属性）。
The above way is the most clear and common one, however some researches proves that it's not the fastest way. You could put that JavaScript right before </body>element, skipping jQuery.read()($(function() { ... });in this case, which is a short form of that). You'll gain some milliseconds (or even less) in that case, but I just feel forced to notice that.
上述方式是最清晰、最常用的一种方式，但也有研究证明它不是最快的方式。您可以将 JavaScript 放在</body>元素之前，跳过jQuery.read()（$(function() { ... });在这种情况下，这是元素的缩写形式）。在这种情况下，您将获得一些毫秒（甚至更少）的时间，但我只是觉得不得不注意到这一点。
回答by programmer
Yes you should put it inside the body element.
是的，你应该把它放在 body 元素中。
回答by Pointy
If you can, put it at the very endof the <body>element, afteryou've included jQuery, the autocomplete plugin itself, and any other libraries you depend on. Putting scripts at the end of the <body>is generally (at the time of this writing :-) considered to be a best practice because it allows the browser to get to the markup before having to worry about script execution.
如果可以的话，把它放在非常结束了的<body>元素，之后你已经包括jQuery的自动完成插件本身，你依赖于任何其他库。将脚本放在末尾<body>通常（在撰写本文时 :-）被认为是最佳实践，因为它允许浏览器在不必担心脚本执行之前获取标记。
