DOM 通灵术

内容简介：DOM 通灵术

DOM 通灵术可以召唤某一个 DOM 节点，让它出现在当前视图中。除了常用的锚点定位，利用 focus 定位外，还有两个更为神奇的方法。

Element.scrollIntoViewIfNeeded( opt_center )

Webkit 家族的特有属性，当参数为 True 的时候，该元素会出现到它祖先滚动元素在当前视图的正中间。如果为 False ，它会滚动到离它最近的一边边沿。换句话说，如果该元素在视图可见区域下方，它将出现在视图可见区域内部下方，可是区域上方亦然。若参数为空，则默认参数为 True 。该特性有意思的一点是，若该元素已经可见了，就不会执行任何动作，这也是 IfNeeded 含义所在吧。

该方法不是标准规范，属性支持度如上所示，没有 Webkit 血继界限的浏览器是不支持该方法的。

Element.scrollIntoView( opt_top )

当参数为 True 的时候，该元素会出现到它祖先滚动元素在当前视图的最上方。如果为 False ，它会滚动到视图最下方。若参数为空，则默认参数为 True 。与 scrollIntoViewIfNeeded 不同的是，就算元素在视图中，他也会执行该方法的。

除此之外，它还可以接受一个对象作为参数。其中 block: 'start' 对应参数 True ， block: 'end' 对应参数 Flase 。 behavior 参数可以指定元素出现的方式，自动，立即亦或是平滑。但这个参数目前只有 Firefox 支持，其它浏览器都只支持布尔值参数。

{
  behavior: "auto"  | "instant" | "smooth",
  block:    "start" | "end",
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持 码农网

查看所有标签

本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。