锚点的作用及用法

忘是亡心i 2022-06-12 11:09 194阅读 0赞

**锚点的作用及用法**  
    HTML中的a标签大家都非常熟悉，它是超链接标签，通过a标签能够跳转到href中指定的页面及指定的位置，a标签可以做到单页面跳转或多页面跳转，锚点能够跳转到当前页面中指定的位置，也能够跳转到指定的其他页面或其他页面中指定的位置。  
    锚点有2种使用方法，第一种方法是跳转到当前页面中指定的位置，即单页面跳转；第二种方法是跳转到其指定的其他页面。

*  使用方法一：单页面跳转到指定位置。

//a标签中的代码：
        <a href="#demo1">跳转1</a>
        <a href="#node2">跳转2</a>
        <a href="#node3">跳转3</a>

//跳转到的代码
        <p>00000000</p>
        <p>00000000</p>//…省略
        <p id="demo1">11111111</p>
        <p>00000000</p>
        <p>00000000</p>
        <p>00000000</p>//…省略
        <p id="node2">22222222</p>
        <p>00000000</p>//…省略
        <p id="node3">33333333</p>
        <p>00000000</p>//…省略

以上代码得到的效果：

![这里写图片描述][SouthEast]

*  方法二：跳转到其他页面：

<a href="file:///……跳转页面的路径……/index.html">跳转到其他页面</a>

以上代码得到的效果：

![这里写图片描述][SouthEast 1]

在路径后面加上对应属性名称，即可跳转到其他页面的指定位置：

<a href="file:///……跳转页面的路径……/anchor.html#node2">跳转到其他页面的指定位置</a>

以上代码得到的效果:

![这里写图片描述][SouthEast 2]

a标签通过锚点即可达到单页面或多页面跳转，并能够达到多需指向的位置。

[SouthEast]: /images/20220612/80e9165f4ad14311a2b087e08ef328ff.png
[SouthEast 1]: /images/20220612/9b0a8270ab9c4d498401a2415fe537ea.png
[SouthEast 2]: /images/20220612/90b5aed5c770433fb9a9d963d021d3db.png

发表评论取消回复

表情：

评论列表（有 0 条评论，194人围观）

还没有评论，来说两句吧...

相关阅读

相关响应头Content-disposition的作用及用法

我们在用做文件下载案例时，经常会用到响应头Content-disposition来设置文件下载对话框。一、作用：　　1）希望某类或者某已知MIME类型的文件(比如：\.

淡淡的烟草味﹌/ 2022年10月14日 05:28/ 0 赞/ 550 阅读

相关 Core文件作用、设置及用法

1.Core文件简介 Core文件其实就是内存的映像，当程序崩溃时，存储内存的相应信息，主用用于对程序进行调试。当程序崩溃时便会产生core文件，其实准确的应该说是core

r囧r小猫/ 2022年10月02日 05:44/ 0 赞/ 406 阅读

相关 Python中find函数的作用及用法

概念： Python find() 方法检测字符串中是否包含子字符串 str ，如果指定 beg（开始）和 end（结束）范围，则检查是否包含在指定范围内，如果包含子字符

朱雀/ 2022年09月16日 11:29/ 0 赞/ 181 阅读

相关锚点的代码

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" />

红太狼/ 2022年08月29日 09:39/ 0 赞/ 166 阅读

相关 android--LayoutInflater作用及用法

在实际开发中LayoutInflater这个类还是非常有用的，它的作用类似于findViewById()。不同点是LayoutInflater是用来找res/layout/

男娘i/ 2022年08月12日 16:16/ 0 赞/ 133 阅读

相关锚点的使用

我们可以理解锚点为一种超链接，只不过它是网页内部的超链接。我们可以利用它跳转到网页内指定的位置使用技巧: <div id="sa" name="sa">我是锚点，哈哈

ゝ一世哀愁。/ 2022年07月19日 11:58/ 0 赞/ 197 阅读

相关锚点的作用及用法

锚点的作用及用法 HTML中的a标签大家都非常熟悉，它是超链接标签，通过a标签能够跳转到href中指定的页面及指定的位置，a标签可以做到单页面跳转或多页面跳转，锚点

忘是亡心i/ 2022年06月12日 11:09/ 0 赞/ 195 阅读

相关 innerHTML的作用及用法。

对innerHTML的用法有些模糊，今天来总结一下： 1、innerHTML有两个作用：（1）获取对象的内容；（2）向对象插入内容；例：这是内容，由于i

古城微笑少年丶/ 2022年02月19日 05:19/ 0 赞/ 1360 阅读

相关锚点

$('.kk').on('click', function(e) { var thisId = $(this).attr('id');

男娘i/ 2021年09月19日 11:16/ 0 赞/ 376 阅读

相关 javascript 扩展运算符(spread)三个点(...)的作用及用法

在javascript中“...”的作用：将一个数组转为用逗号分隔的参数序列。 //该运算符主要用于函数调用。<br>function push(array, ...

灰太狼/ 2021年07月26日 22:20/ 0 赞/ 346 阅读