观察者模式又名发布-订阅（Publish/Subscribe）模式，我们通常会使用浏览器原生提供的观察者模式来处理特定的场景，比如MutationObserver等实现pickernumber的修改。

问题引入 在一些官网首页、落地页中，页面开发者往往会在元素上挂载一些渐入渐出的动画，提高页面的生命力和观感。这些动画一般都是依靠 CSS Animation 实现的。但是单纯的 css 存在一些局限，

aos.js（Animate on scroll）是一个轻量的jQuery动画库插件，可以简单的帮我们实现页面滚动触发动画效果，在页面往回滚动时，元素又会恢复到原来的状态，可以使网页更加生动。

DOM小练习 （1.弹幕、 2.电梯导航、 3.倒计时、 4.随机点名、 5.购物放大镜 仅自己做记录

背景 在 element-plus官网，右侧有辅助当前页面滚动的导航栏，有如下能力： 随着当前页面滚动，右侧导航栏的当前高亮会动态进行切换，并且浏览器地址栏的锚点hash会跟随动态变化。 点击右侧导航

先看b站的效果，是当页面滚动时左边的菜单到达某个位置后，右侧的导航条对应的导航会高亮，然后点击右侧导航的某项时，页面会滚动到对应的菜单。 说到这呢，其实心里也大概会有点头绪，点击的效果类似tab栏切换，只是需要滚动而已，而滚动页面时则需要记录滚动值来进行右侧导航栏的高亮显示。好…

电梯导航主要是要实现两个功能点： 1. 点击导航滚动页面到指定位置 2. 滚动到页面的位置实现导航的动态更新

JS实现电梯导航,之前css 利用 scroll-behavior 和 锚点 实现了 电梯导航，点击可以看这篇文章css实现电梯导航的效果。评论区有人想让我用js也实现一下，于是开启了！

我们经常会在博客、文档中看到类似这样的侧边导航目录，例如 这种导航也被称为“电梯导航”（当然可能还有其他叫法，知道是这个交互就行）。它会随着内容的滚动而自动切换当前选中态，点击任意目录也会自动滚动到对