HTML 锚点三种实现方法

在网页中经常用到锚点，特别是在比较长的页面中锚点的使用会增加用户体验。

下面介绍下锚点三种实现方法：

1. 在同一页面中

<a name="add"></a> 或者 <a id="add"></a> 
<a href="#add">跳转到add</a>

（ps：用id兼容性好些）

2. 在不同页面中

锚点定位在a.html中，从另外一个页面的链接跳转到这个锚点

<a href="a.html#add">跳转到a.add</a>

3. 点击链接触发js事件，同时跳转到锚点，

有两种处理方式： 第一种：

<a href="#add" onclick="add()">触发add函数并跳转到add锚点</a>

第二种：

<p id="pNode"></p>
<a href="#" onclick="document.getElemetnById('pNode').scrollIntoView(true);return false;">scrollIntoView</a>

通过scrollIntoView实现锚点效果

scrollIntoView()的用法 scrollIntoView是一个与页面（容器）滚动相关的API，该API只有boolean类型的参数能得到良好的支持（firefox 36+都支持）

参数Boolean类型的情况 调用方法为 element.scrollIntoView() 参数默认为true。

参数为true时调用该函数，页面（或容器）发生滚动，使element的顶部与视图（容器）顶部对齐；

参数为false时，使element的底部与视图（容器）底部对齐。

提示：页面（容器）可滚动时才可有效.