scrollIntoView

简介

DOM规范中并没有规定各浏览器需要实现怎样的滚动页面区域，各浏览器实现了相应的方法，可以使用不同的方式控制页面区域的滚动。这些方法作为HTMLElement类型的扩展存在，所以它能在所有元素上使用。

方法

1. scrollIntoView(alignWithTop)：滚动浏览器窗口或容器元素，以便在当前视窗的可见范围看见当前元素。如果alignWithTop为true，或者省略它，窗口会尽可能滚动到自身顶部与元素顶部平齐。——-目前各浏览器均支持
2. scrollIntoViewIfNeeded(alignCenter)：只在当前元素在视窗的可见范围内不可见的情况下，才滚动浏览器窗口或容器元素，最终让当前元素可见。如果当前元素在视窗中可见，这个方法不做任何处理。如果将可选参数alignCenter设置为true，则表示尽量将元素显示在视窗中部（垂直方向）——Safari、Chrome实现了这个方法
3. scrollByLines(lineCount)：将元素的内容滚动指定的行数的高度，lineCount的值可以为正值或是负值。—Safari、Chrome实现了这个方法
4. scrollByPages(pageCount)：将元素的内容滚动指定的页面的高度，具体高度由元素的高度决定。—Safari、Chrome实现了这个方法

scrollIntoView()和scrollIntoVIewIfNeeded()作用的是元素的窗口，而scrollByLines()、scrollByPages()影响元素自身

由于只有scrollIntoView被各浏览器均支持，所以这个方法最为常用

 if (choice === 'exit') {      document.getElementById(`question${unmarkedIndex}`).scrollIntoView(true)    }

兼容性

由于这个属性还没有成为通用标准，所以使用前需要注意兼容性， 具体见这里， 基本上各个浏览器的支持情况还是不错的，只是有的设置选项scrollIntoViewOptions 并不支持

参考

• http://www.cnblogs.com/mopagunda/p/4899389.html
• https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView