效果简介

简要介绍

事件处理、DOM遍历和DOM操作等功能为网页增添了必要的功能。但如何进一步提升，让我们的网页看起来更吸引人，并且更具交互性呢？

这时，jQuery的效果和动画就显得尤为重要。这些效果和动画主要关注网页的非功能性方面，目标是使网页呈现出更加动态和视觉上更吸引人的外观。

示例

让我们通过待办事项列表项目来理解简单效果和动画的重要性与影响。我们已经实现了一个待办事项列表的基本功能，但没有添加任何效果或动画。请在下方网页中尝试执行以下操作：

1. 添加一个新任务。
2. 将任务从“待办”移动到“已完成”。
3. 删除任务。

你会注意到，这些操作发生得非常突兀，没有任何过渡效果或视觉提示。

现在，在下面的网页中重复相同的操作。注意当你点击按钮时，任务会逐渐淡出、消失，并淡入“已完成”列表。同样，当你点击删除按钮时，任务会缓慢淡出，而不是瞬间消失。

简单的动画效果让网页及其各项操作变得更加美观、直观，也更赏心悦目。因此，尽管这些效果和动画并不增加功能，但对于设计良好的网页来说却是必不可少的。

jQuery中的不同效果

jQuery为我们提供了简洁的接口以及多个实用的方法，用于实现各种效果和动画。下图展示了jQuery中不同类型的效果。