一、事件概述
事件的基本概念
上一章我们讲解了使用jQuery选择器获取元素，并通过一些方法来操作元素，本章我们讲解事件的概念，通过事件我们可以加强用户与浏览器的交互性，例如可以实现当用户点击某个元素的时候，对元素做一些操作，或是移动鼠标，对元素做一些操作。
事件的分类
事件主要可以分为以下几类：
- 鼠标事件
- 键盘事件
- 文档事件
2025年08月18日
事件的基本概念
上一章我们讲解了使用jQuery选择器获取元素，并通过一些方法来操作元素，本章我们讲解事件的概念，通过事件我们可以加强用户与浏览器的交互性，例如可以实现当用户点击某个元素的时候，对元素做一些操作，或是移动鼠标，对元素做一些操作。
事件的分类
事件主要可以分为以下几类：
2025年08月18日
像大多数前端开发者一样，青衿也经常会用到交互效果的往复切换，比如折叠面板的展开和折叠，动画效果的循环，点击效果的切换等等。
刚刚接触jQuery的时候青衿都是使用.toggle()方法。jquery的.toggle()方法可以添加 click 事件之间要切换的两个或多个函数，刚刚学习juqery的时候这个方法是非常好用的。
但是在1.9及以上版本中.toggle()却被移除了。让一些新手做click效果切换的时候就遇到了困难。不过有什么是jQuery不能解决的呢？一个方法倒下了，千千万万个方法涌现了出来。
2025年08月18日
现在各种类库满天飞，说jQuery有多快多快，可是对前端大牛来说，更定不会止步于jQuery，因而常常听到高级的前端工程师追求原生js，为何？答案是原生JS要更快，原因是JQuery这样的库必须要兼容各种浏览器和低版本和许多其他的东西，考虑通用性必然会导致性能的损耗。
当然，我不是提倡写代码纯用原生JS实现，请记住：“框架能够让我们走的更快，但只有了解原生的JS才能让我们走的更远”。
下面直接用代码示例：流行的常用的JQuery功能用原生JS实现。