如何将 jQuery 添加到 HTML 页面？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13829667/
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
How to add jQuery to an HTML page?
提问by user1888584
I was given this chunk of code to place in my html page but I know nothing about javascript so I have no idea where to place it and what kind of tag to place it in.
我得到了这段代码放在我的 html 页面中，但我对 javascript 一无所知，所以我不知道把它放在哪里以及放什么样的标签。
$('input[type=radio]').change(function() {
$('input[type=radio]').each(function(index) {
$(this).closest('tr').removeClass('selected');
});
$(this).closest('tr').addClass('selected');
});
回答by Andrew
Including the jQuery Library
包括 jQuery 库
That is jQuery code. You'll first need to make sure the jQuery library is loaded. If you don't host the library file yourself, you can hotlink one from the jQuery CDN:
那是jQuery代码。您首先需要确保加载了 jQuery 库。如果您不自己托管库文件，则可以从jQuery CDN 热链接一个：
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
You can do this within the <head>section, but it's fine as long as it's loaded before your jQuery code.
您可以在该<head>部分中执行此操作，但只要在您的 jQuery 代码之前加载它就可以了。
Further reading:
进一步阅读：
Placing Your Code in the Page
将您的代码放在页面中
Place your code inside <script>tags. It can be inserted anywhere within either <head>or <body>. If you place it before the <input>and <tr>tags (as referenced in your code), you have to use $(document).ready()to make sure those elements are present before the code is run:
将您的代码放在<script>标签内。它可以插入到<head>或 中的任何位置<body>。如果你把它放在<input>and<tr>标签之前（如你的代码中所引用的），你必须$(document).ready()在代码运行之前使用来确保这些元素存在：
$(document).ready(function() {
// put your jQuery code here.
});
If you want your page content to be loaded as soon as possible, you might want to place it as close as the </body>close tag as possible. But another common practice is to place all JavaScript code in the <head>section. This is your choice, based on your coding style and needs.
如果您希望尽快加载您的页面内容，您可能希望将其放置在尽可能靠近</body>结束标记的位置。但另一种常见做法是将所有 JavaScript 代码放在该<head>部分中。这是您的选择，基于您的编码风格和需求。
Suggestion:Instead of embedding JS/jQuery code directly into an HTML page, consider placing the code in a separate .js file. This will allow you to reuse the same code on other pages:
建议：不要将 JS/jQuery 代码直接嵌入到 HTML 页面中，而应考虑将代码放在单独的 .js 文件中。这将允许您在其他页面上重用相同的代码：
<script src="/path/to/your/code.js"></script>
Further reading:
进一步阅读：
回答by Diodeus - James MacFarlane
You need to wrap this in script tags:
您需要将其包装在脚本标签中：
<script type='text/javascript'> ... your code ... </script>
That being said, it's important WHEN you execute this code. If you put this in the page BEFORE the HTML elements that it is hooking into then the script will run BEFORE the HTML is actually rendered in the page, so it will fail.
话虽如此，执行此代码时很重要。如果你把它放在页面中它挂入的 HTML 元素之前，那么脚本将在 HTML 实际呈现在页面中之前运行，所以它会失败。
It is common practice to wrap this type of code in a "document ready" block, like so:
通常的做法是将此类代码包装在“文档就绪”块中，如下所示：
<script type='text/javascript'>
$(document).ready(function() {
... your code...
}}
</script>
This ensures that the entire page has rendered in the browser BEFORE your code is executed. It is also a best practice to put the code in the <head>section of your page.
这可确保在执行代码之前在浏览器中呈现整个页面。将代码放在<head>页面的某个部分也是一种最佳做法。
回答by Jared
Inside of your <head></head>tags add...
在您的<head></head>标签内添加...
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('input[type=radio]').change(function() {
$('input[type=radio]').each(function(index) {
$(this).closest('tr').removeClass('selected');
});
$(this).closest('tr').addClass('selected');
});
});
</script>
EDIT: The placement inside of <head></head>is not the only option...this could just as easily be placed RIGHT before the closing </body>tag. I generally try and place my JavaScript inside of headfor placement reasons, but it can in some cases slow down page rendering so some will recommend the latter approach (before closing body).
编辑：放置在里面<head></head>不是唯一的选择......这可以很容易地放在结束</body>标签之前。head出于放置原因，我通常会尝试将我的 JavaScript 放在里面，但在某些情况下它会减慢页面渲染速度，因此有些人会推荐后一种方法（在关闭之前body）。
回答by Abdul Moiz Khan
You can include JQuery using any of the following:
您可以使用以下任何一种方式包含 JQuery：
- Link Using jQuery with a CDN
- 使用带有 CDN 的 jQuery 链接
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
- Download Jquery From Here and include in your project
- 从这里下载 Jquery 并包含在您的项目中
- Download latest version using this link
- 使用此链接下载最新版本
- http://code.jquery.com/jquery-latest.min.js(never use this link on production server)
- http://code.jquery.com/jquery-latest.min.js（切勿在生产服务器上使用此链接）
Your code placement can look something like this
您的代码位置可能如下所示
- Your Jquery should be included before using it any where else it will throw an error
- 你的 Jquery 应该在使用它之前被包含在它会抛出错误的任何其他地方
```
``
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
$(document).ready(function(){
$('input[type=radio]').change(function() {
$('input[type=radio]').each(function(index) {
$(this).closest('tr').removeClass('selected');
});
$(this).closest('tr').addClass('selected');
});
});
</script>
```
``
回答by suprob
Include javascript using script tags just before your ending body tag. Preferably you will want to put it in a separate file and link to it to keep things a little more organized and easier to read. Theres a simple article here that will show you how http://www.selftaughtweb.com/how-to-include-javascript/
在结束正文标签之前使用脚本标签包含 javascript。最好将它放在一个单独的文件中并链接到它，以使事情更有条理，更易于阅读。这里有一篇简单的文章，将向您展示如何http://www.selftaughtweb.com/how-to-include-javascript/
回答by Николай Корнюшин
You need this code wrap in tags and put on the end of page. Or create JS file (for example test.js), write this code on it and put on the end of page this tag
您需要将此代码包装在标签中并放在页面的末尾。或者创建JS文件（例如test.js），在上面写上这段代码，在页面的末尾加上这个标签
