锚点定位方法与总结

版权声明：本文为博主原创文章，遵循 CC 4.0 by-sa 版权协议，转载请附上原文出处链接和本声明。 本文链接：https://blog.csdn.net/weixin_41864502/article/details/95004105

锚点定位方法与总结
当我们制作一个很长的网页时，需要在页面内做一个导航，点击导航里的连接不是新开一个窗口或者跳转到其它网址，而是转到当前页的某一个位置，那么所有要跳转到的哪个位置，我们就叫做锚点，它是一种在页面内部定位的方式。

一、锚点定位方法
HTML结构如下：有个目录标题，一个文章分了三段，每段有个标题
文章内容;

标题一

第一个：很长的文章内容......

标题二

第一个：很长的文章内容......

标题三

第一个：很长的文章内容......

方法一（使用链接name属性）： 如果我现在页面内设置锚点，点击相应的目录标题就跳转到相应的标题段落，那么就要在标题所在的HTML标签里设置链接和name属性，然后链接过去即可，如下：

标题一

标题二

标题三

然后在目录标题中，设置超链接就可以实现和锚点的链接了。 点我跳到标题一 点我跳到标题二 点我跳到标题三 方法二（使用ID）： 主流的浏览器几乎都支持name属性，在HTML之前的版本中，只有使用，标签的name属性才能创建片段标识符随着HTML发展ID属性的出现，所有HTML或XHTML元素都可以是片段标识符。这是因为ID标识符几乎可以用在所有的标签中。标签为了能够和以前的版本相兼容而保留了name属性，同时也可以使用id属性，这些属性可以相互交换使用，可以把id属性看做是name属性的升级版本。name和id属性都可以与href属性结合起来使用。 id或name属性的值可以是引号引起来的任何字符串。字符串必须是唯一的标记，不能再同一个文档中的其它name或id属性中重发使用，但是可以在不同的文档中再次使用。 如果使用id属性，上面的实例可改写为：

标题一
标题二
标题三
或者直接在标题中设置id试下：

标题一

标题二

标题三

注意：
使用name属性只能针对a标签来定位，而对其它标签就不能起到定位作用。
id的定位可以针对任何标签来定位。
二、用锚链接跳转其它页面指定位置
首先在A页面的你要跳转的链接href末尾加上#锚点名称：
点我跳到标题一
然后在你要跳转的B页面的位置添加id或者name

标题一

或者

标题一