jquery 入门
jQuery 入门指南
什么是 jQuery
jQuery 是一个快速、简洁的 JavaScript 库，简化了 HTML 文档遍历、事件处理、动画设计和 Ajax 交互。它兼容多种浏览器，是前端开发中常用的工具之一。
引入 jQuery
在 HTML 文件中通过 CDN 引入 jQuery，以下是最新版本的引入方式：
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>基本语法
jQuery 的核心是通过选择器选取 DOM 元素并对其进行操作。基本语法结构为：
$(selector).action()$是 jQuery 的别名。selector用于查找 HTML 元素。action()是对元素执行的操作。
常用选择器
jQuery 使用 CSS 选择器语法来选取元素：
// 选取所有 <p> 元素
$("p")
// 选取 class 为 "example" 的元素
$(".example")
// 选取 id 为 "demo" 的元素
$("#demo")事件处理
jQuery 简化了事件绑定，例如点击事件：
$("button").click(function() {
alert("按钮被点击了！");
});DOM 操作
常见的 DOM 操作方法包括：
// 获取或设置元素内容
$("#demo").text("Hello, jQuery!");
// 添加或移除类
$("#demo").addClass("highlight");
$("#demo").removeClass("highlight");
// 隐藏或显示元素
$("#demo").hide();
$("#demo").show();动画效果
jQuery 提供简单的动画效果：
// 淡入淡出
$("#demo").fadeOut();
$("#demo").fadeIn();
// 滑动效果
$("#demo").slideUp();
$("#demo").slideDown();Ajax 请求
jQuery 简化了 Ajax 调用：
$.ajax({
url: "example.php",
method: "GET",
success: function(response) {
console.log(response);
},
error: function(error) {
console.log(error);
}
});链式调用
jQuery 支持链式调用，可以在一个语句中执行多个操作：
$("#demo").css("color", "red").slideUp(2000).slideDown(2000);插件扩展
jQuery 有丰富的插件生态系统，可以通过引入插件扩展功能：
<script src="jquery-plugin.js"></script>学习资源
通过以上内容，可以快速掌握 jQuery 的基本用法并开始实际开发。
