要在HTML中加入jQuery（通常简称为jq）代码，你需要遵循以下步骤：
（图片来源网络，侵删）
1. 引入jQuery库
在HTML文档的<head>标签内，通过<script>标签引入jQuery库，你可以使用以下两种方法之一：
方法一：使用CDN（推荐）
通过CDN（内容分发网络）引入jQuery是最方便的方法，你可以在HTML文档中添加以下代码：
<head>
<!... 其他头部信息 ... >
<script src="https://code.jquery.com/jquery3.6.0.min.js"></script>
</head>
这里使用的是jQuery的最新版本，你也可以根据需要选择其他版本。
方法二：本地引用
如果你已经下载了jQuery库文件，可以将其保存在本地，并在HTML文档中引用，如果你将jQuery文件保存在名为js的文件夹中，可以使用以下代码：
<head>
<!... 其他头部信息 ... >
<script src="js/jquery3.6.0.min.js"></script>
</head>
2. 编写jQuery代码
在引入jQuery库之后，你可以在<script>标签中编写jQuery代码，有两种方法可以实现：
方法一：直接在<script>标签中编写
在HTML文档中的<body>标签内，添加一个<script>标签，并在里面编写jQuery代码。
<body>
<!... 页面内容 ... >
<script>
$(document).ready(function() {
// 在这里编写jQuery代码
});
</script>
</body>
方法二：外部JavaScript文件
将jQuery代码保存在一个外部JavaScript文件中，然后在HTML文档中引用该文件，如果你将jQuery代码保存在名为main.js的文件中，可以使用以下代码：
<body>
<!... 页面内容 ... >
<script src="main.js"></script>
</body>
3. 编写jQuery代码示例
以下是一些简单的jQuery代码示例：
示例一：隐藏元素
$(document).ready(function() {
$("#elementId").hide(); // 隐藏ID为"elementId"的元素
});
示例二：修改元素样式
$(document).ready(function() {
$(".className").css("color", "red"); // 将所有类名为"className"的元素的字体颜色更改为红色
});
示例三：事件处理
$(document).ready(function() {
$("button").click(function() {
alert("按钮被点击了！"); // 当按钮被点击时，弹出提示框
});
});
4. 注意事项
确保在使用jQuery之前已经正确引入了jQuery库。
使用$(document).ready()函数确保在DOM加载完成后执行jQuery代码。
使用#选择器选择ID，使用.选择器选择类名。
jQuery代码应放在<script>标签中，或者在外部JavaScript文件中。
按照以上步骤，你可以在HTML中成功添加并使用jQuery代码，希望这些信息对你有所帮助！
评论(0)