JS实现页面快速定位

最新推荐文章于 2024-02-01 22:28:21 发布

Tina_1202

最新推荐文章于 2024-02-01 22:28:21 发布

阅读量4.4k

点赞数 1

分类专栏： JavaScript 文章标签： javascript 快速定位

本文链接：https://blog.csdn.net/Tina_1202/article/details/80060935

版权

JavaScript 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

今天在分享一个非常小但是很实用的js效果：页面快速定位

实现效果：点击页面按钮，即可跳转到指定位置

话不多少，贴代码：

<div class="button"><a href="#aaa">我是一个跳转按钮</a></div>

跳转指定位置标签

<div class="div1" id="aaa">  这是一个锚点测试</div>

js部分：

<script>
    window.location.hash  = "#aaa";      // #aaa为锚点名称
</script>

贴一个我做小测试的代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf8">
    <title>js锚点跳转测试</title>
    <style>
.div1{
    border:2px red solid;
    background:#FF0;
    color:#00F;
}
.button a{
    color:#FF8956;
}
    </style>
</head>
<body>
    <p>我是一个空间站位</p>
    <div class="button"><a href="#aaa">我是一个跳转按钮</a></div>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <div class="div1" id="aaa">  这是一个锚点测试</div>
     <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
    <p>我是一个空间站位</p>
</body>
<script>
    window.location.hash  = "#aaa";      // firstAnchor为锚点名称
</script>
</html>

Tina_1202

关注

1
点赞
踩
7

收藏

觉得还不错? 一键收藏
1
评论
JS实现页面快速定位

今天在分享一个非常小但是很实用的js效果：页面快速定位实现效果：点击页面按钮，即可跳转到指定位置话不多少，贴代码：&lt;div class="button"&gt;&lt;a href="#aaa"&gt;我是一个跳转按钮&lt;/a&gt;&lt;/div&gt;跳转指定位置标签&lt;div class="div1" id="aaa"&gt;
复制链接

扫一扫