JavaScript ermittelt die Position der Bildlaufleiste und verschiebt die Seite zum Ankerpunkt

<Stil>
    #meindiv{
      Höhe: 1200px;
      Breite: 100 %;
      Hintergrundfarbe: rosa;
      Position: relativ;
    }
    A{
      Position: absolut;
      oben: 1000px;
      links: 1000px;
    }
   </Stil>
  <div id="meindiv">
    Ich bin oben auf der Seite</div>
  <a href="#mydiv" rel="external nofollow" >Zurück zum Anfang</a>

<Stil>
    Körper{
      Position: relativ;
    }
    h1{
      Rand: 0 automatisch;
    }
    .mybtn1{
      Position: fest;
      links: 200px;
      oben: 500px;
    }
    .mybtn2{
      Position: fest;
      links: 200px;
      oben: 550px;
    }
  </Stil>
  <Text>
    <h1 id="topH1">1</h1>
    <h1>2</h1>
    <h1>3</h1>
    <h1>4</h1>
    <h1>5</h1>
    <h1>6</h1>
    <h1>7</h1>
    <h1>1</h1>
    <h1>2</h1>
    <h1>3</h1>
    <h1>4</h1>
    <h1>5</h1>
    <h1>6</h1>
    <h1>7</h1>
    <h1>1</h1>
    <h1>2</h1>
    <h1>3</h1>
    <h1>4</h1>
    <h1>5</h1>
    <h1>6</h1>
    <h1 id="tobtmH1">7</h1>
  <button class="mybtn1" onclick="toTop()">Zurück zum Anfang</button>
  <Skript>
   Funktion toTop(){
    var topH1 = document.getElementById("topH1")
    document.documentElement.scrollTop=topH1.offsetTop 
    window.pageYOffset=topH1.offsetTop 
    Dokument.body.scrollTop=topH1.offsetTop;
    
   }
  </Skript> 
  </body>

<Stil>
    Körper{
      Position: relativ;
    }
    .meindiv{
      Rand oben: 100px;
      Rand: 1px durchgehend rosa;
    }
    h1{
      Rand: 0 automatisch;
    }
    .mybtn1{
      Position: fest;
      links: 200px;
      oben: 500px;
    }
    .mybtn2{
      Position: fest;
      links: 200px;
      oben: 550px;
    }
</Stil>
<Text>
  <div Klasse="meindiv">
  <h1 id="topH1">1</h1>
  <h1>2</h1>
  <h1>3</h1>
  <h1>4</h1>
  <h1>5</h1>
  <h1>6</h1>
  <h1>7</h1>
  <h1>1</h1>
  <h1>2</h1>
  <h1>3</h1>
  <h1>4</h1>
  <h1>5</h1>
  <h1>6</h1>
  <h1>7</h1>
  <h1>1</h1>
  <h1>2</h1>
  <h1>3</h1>
  <h1>4</h1>
  <h1>5</h1>
  <h1>6</h1>
  <h1 id="tobtmH1">7</h1>
</div>
  <button class="mybtn1" onclick="toTop()">Zurück zum Anfang</button>
  <button class="mybtn2" onclick="toBtm()">Nach unten gehen</button>
  <Skript>
    fenster.onload = funktion(){

    }
  // Die aufrufende Methode ist element.scrollIntoview()
  //Wenn der Parameter wahr ist, wird die Seite oder der Container so gescrollt, dass die Oberkante des Elements mit der Oberkante des Ansichtscontainers ausgerichtet ist. //Wenn der Parameter falsch ist, wird die Unterkante des Elements mit der Unterkante des Ansichtscontainers ausgerichtet. Funktion toTop(){
      var topH1 = document.getElementById('topH1')
      topH1.scrollIntoView(true)
    }
    Funktion toBtm() {
      var tobtmH1 = document.getElementById('tobtmH1')
      tobtmH1.scrollIntoView(false)
    }
  </Skript> 
</body>