JS implements a tag anchor point positioning

created at 07-03-2021 views: 1
<a href="#a1">Click</a>
<div id="a1">Content content</div>

Overview

The traditional anchor point positioning method in html is realized by using the href attribute value of the a tag and the id value of the dom element. This method directly jumps to a new page in Vue. The reason is the traditional anchor point positioning method. It doesn't work when using vue-router.

Improve:

<a href="#a1" onClick="clickSilder">Click</a>
<div id="a1">Content content</div>
function clickSilder(){
   // Get DOM elements
   let el: any = document.querySelector('a1');
   // chrome
   document.body.scrollTop = el.offsetTop;
   // firefox
   document.documentElement.scrollTop = el.offsetTop;
}
Please log in to leave a comment.