🐸 青蛙编程网

jQuery 教程

jQuery 是一个简洁、快速的 JavaScript 库,目的就是「写更少的代码,做更多的事情」(Write Less, Do More)。

它帮我们封装了 DOM 操作、事件处理、动画效果、AJAX 请求等常用功能,让原本繁琐的 JavaScript 代码变得简单易读,非常适合零基础同学过渡到前端交互阶段。

学习目标

学完本章,你将能够:

  • 理解 jQuery 是什么,以及它解决了哪些问题
  • 学会在页面中引入 jQuery
  • 熟练使用 jQuery 选择器选取页面元素
  • 掌握 jQuery 的 DOM 增删改查操作
  • 学会用 jQuery 处理鼠标、键盘等事件
  • 使用 jQuery 实现常见动画和效果
  • 初步掌握 jQuery AJAX 的基本用法
  • 完成一个小型综合练习,巩固所学知识

学习路线

章节 核心内容
1. jQuery 是什么 jQuery 简介、优势、适用场景
2. 第一个 jQuery 程序 引入 jQuery、文档就绪、基础语法
3. 选择器 基本选择器、层级选择器、过滤选择器
4. DOM 操作 获取/设置内容、属性、样式、添加/删除元素
5. 事件处理 鼠标事件、键盘事件、事件绑定与委托
6. 效果与动画 显示/隐藏、淡入淡出、滑动、自定义动画
7. AJAX 基础 $.get、$.post、load 基本用法
8. 综合练习:待办清单 用 jQuery 实现一个可增删的待办清单

学习建议

  • 边写边跑:每个示例都建议直接在浏览器中运行,观察效果。
  • 对比 JavaScript:如果你已经学过 JavaScript,可以对比 jQuery 和原生 JS 的写法,体会它的简洁性。
  • 循序渐进:先掌握选择器和事件这两个最常用的部分,再去学习 DOM、动画和 AJAX。

准备好了吗?从 第 1 章:jQuery 是什么 开始吧!