jquery基础

jQuery 基础概念
jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画设计和 Ajax 交互。它的核心特点是“写得更少,做得更多”(Write Less, Do More),通过链式调用和简洁的 API 提高开发效率。
jQuery 核心功能
- DOM 操作:通过选择器(如
$("p"))获取元素,并修改内容、属性或样式。 - 事件处理:例如
click()、hover()等方法绑定事件。 - 动画效果:如
fadeIn()、slideUp()等内置动画方法。 - Ajax 支持:简化异步请求,如
$.ajax()、$.get()。
基本语法示例
// 选择器与 DOM 操作
$("#myButton").click(function() {
$("p").text("内容已更新").css("color", "red");
});
// Ajax 请求
$.get("https://api.example.com/data", function(response) {
console.log(response);
});
常用选择器
$("tag"):标签选择器(如$("div"))。$(".class"):类选择器(如$(".item"))。$("#id"):ID 选择器(如$("#header"))。$("parent > child"):子元素选择器。
链式调用示例
$("#myDiv")
.addClass("highlight")
.fadeOut(1000)
.fadeIn(500);
注意事项
- 引入 jQuery 库:需在代码前通过
<script>标签加载 jQuery(如 CDN 链接)。 - 兼容性:jQuery 1.x 支持旧版 IE,2.x+ 仅支持现代浏览器。
- 现代替代:随着原生 JavaScript 功能增强(如
querySelector、fetch),jQuery 的使用逐渐减少,但在旧项目或快速开发中仍有价值。
如需进一步学习,可参考官方文档(jQuery.com)或交互式教程(如 Codecademy)。







