JS實現頁面快速定位
阿新 • • 發佈：2019-02-13
今天在分享一個非常小但是很實用的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>