1. before
  2. <ol id="ol">
  3.   <li>prepend</li>
  4.   <li>0</li>
  5.   <li>1</li>
  6.   <li>2</li>
  7.   <li>append</li>
  8. </ol>
  9. after

对页面指定位置：

通用的解决方案 window.scrollBy(x,y) 和 window.scrollTo(pageX,pageY)。

页面当前滚动位置：

  1. window.pageYOffset
  2. window.pageXOffset

文档的宽度/高度

  1. documentElement.clientWidth/Height // 文档元素的宽高是 
  2. documentElement.scrollWidth/scrollHeight // 测量它的最大值。

滚动到可视范围

  1. elem.scrollIntoView(top) 会使 elem 滚动到可视范围。它有一个结论：
  3. // 如果 top=true（默认值），页面滚动使 elem 会出现到窗口顶部。元素的上边缘与窗口顶部对齐。
  4. // 如果 top=false，则页面滚动使 elem 会出现在窗口底部。元素的下边缘与窗口底部对齐。

获取文档坐标

  1. // 获取元素的文档坐标
  2. function getCoords(elem) {
  3.   let box = elem.getBoundingClientRect();
  5.   return {
  6.     top: box.top + pageYOffset,
  7.     left: box.left + pageXOffset
  8.   };
  9. }

获取窗口的坐标

  1. elem.getBoundingClientRect() 方法返回一个 elem 的窗口坐标对象，这个对象有以下这些属性：
  3. top — 元素顶部边缘的 Y 坐标
  4. left — 元素左边边缘的 X 坐标
  5. right — 元素右边边缘的 X 坐标
  6. bottom — 元素底部边缘的 Y 坐标