jquery c
jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。以下是 jQuery 的核心功能和常见用法:
基本语法
jQuery 通过 $ 符号作为别名,核心语法为 $(selector).action()。选择器基于 CSS 语法,支持 ID、类、标签等选择方式。
$("#id").hide(); // 隐藏 ID 为 "id" 的元素
$(".class").css("color", "red"); // 修改类为 "class" 的元素的文字颜色
DOM 操作
jQuery 提供了简洁的 DOM 操作方法,例如:
$("p").text("新文本"); // 修改段落文本
$("div").append("<p>追加内容</p>"); // 在 div 内追加新段落
$("img").attr("src", "new-image.jpg"); // 修改图片的 src 属性
事件处理
jQuery 简化了事件绑定,支持 click、hover、keypress 等常见事件:
$("button").click(function() {
alert("按钮被点击");
});
$("input").keypress(function(event) {
if (event.which === 13) alert("回车键按下");
});
动画效果
内置动画方法如 hide、show、fadeIn、slideUp 等:
$("#box").fadeOut(1000); // 1 秒内淡出
$("#panel").slideToggle(500); // 0.5 秒内滑动切换显示/隐藏
Ajax 支持
简化 Ajax 请求,支持 get、post 等方法:
$.get("url", function(data) {
console.log("获取的数据:", data);
});
$.post("url", { key: "value" }, function(response) {
alert("服务器响应:" + response);
});
链式调用
jQuery 支持链式调用,允许多个方法连续执行:
$("#element")
.css("background", "yellow")
.slideUp(2000)
.slideDown(2000);
实用工具方法
提供 $.each、$.map 等工具函数:
$.each([1, 2, 3], function(index, value) {
console.log(index + ": " + value);
});
插件扩展
jQuery 的插件机制允许扩展功能,例如表单验证插件 jQuery Validation:

$("#form").validate({
rules: { username: "required" },
messages: { username: "用户名不能为空" }
});
jQuery 的跨浏览器兼容性和简洁 API 使其成为前端开发中的经典工具,尽管现代框架如 React/Vue 逐渐流行,jQuery 仍在遗留项目或简单场景中广泛使用。






