关于前端:页面滚动默认行为那些事一

若不心愿底层滚动

能够用preventDefault阻止浏览器默认行为
通过监听touchstart、touchmove、touchend事件，判断滑动是在滚动元素内则进行滚动，否则阻止默认滚动行为。
在参考文章1作者形象了一个简略的办法（带源码，可参考）
```
$.smartScroll(container, selectorScrollable);
```
应用css新属性overscroll-behavior设置滚动到边界的行为

PS：overscroll-behavior是较新的css属性，目前看还需思考兼容性和局限性问题。比方“滚动区”内容不多，没呈现滚动条的时候，此属性并不能阻止默认滚动的。（参考文章3）

挪动Web滚动性能优化: `Passive event listeners`

Passive event listeners是2016年Google I/O上提出的，是为了晋升页面滑动的晦涩度。

对于Passive更具体背景和阐明可查阅参考文章2，这里简要介绍一下。

咱们在滑动页面的时候触发了touch相干事件，开发者能够通过preventDefault来阻止滑动行为，浏览器须要期待绑定事件执行完（假如耗时200ms），才晓得，“哦～原来你没有阻止默认行为，好的，我马上滚”，这样就导致滑动晦涩度上有提早。

而passive作用是开发者能够提前通知浏览器，我不调用preventDefault阻止事件默认行为，浏览器就能够疾速生成事件行为，从而晋升页面性能。

当初大部分支流浏览器都提供了对 passive 的原生反对。

在最新的DOM标准中，事件绑定的第三个参数变成了对象：

target.addEventListener(type, listener[, options]);

options里传入passive:true就是明确通知浏览器，该事件不会调用preventDefault来阻止默认滑动行为。