Hoe link ik naar een deel van een pagina? (hash?)

Hoe koppel je (met <a>) zodat de browser naar een bepaalde subkop op de doelpagina gaat in plaats van naar de bovenkant?


Antwoord 1, autoriteit 100%

Als er een tag is met een id(bijv. <div id="foo">), dan kun je eenvoudig #foonaar de URL. Anders kunt u niet willekeurig naar delen van een pagina linken.

Hier is een compleet voorbeeld: <a href="http://example.com/page.html#foo">Jump to #foo on page.html</a>

Voorbeeld van inhoud op dezelfde pagina: <a href="#foo">Jump to #foo on same page</a>

Het wordt een URI-fragmentgenoemd.


Antwoord 2, autoriteit 15%

Je gebruikt een anker en een hash. Bijvoorbeeld:

Doel van de link:

<a name="name_of_target">Content</a>

Link naar het doel:

<a href="#name_of_target">Link Text</a>

Of, als u vanaf een andere pagina linkt:

<a href="http://path/to/page/#name_of_target">Link Text</a>

Antwoord 3, autoriteit 12%

Voeg gewoon een hash toe met een ID van een element aan de URL. Bijv.

<div id="about"></div>

en

http://mysite.com/#about

Dus de link zou er als volgt uitzien:

<a href="http://mysite.com/#about">About</a>

of gewoon

<a href="#about">About</a>

Antwoord 4, autoriteit 8%

Dit is hoe:

<a href="#go_middle">Go Middle</a>
<div id="go_middle">Hello There</div>

Antwoord 5, autoriteit 6%

Op 12 maart 2020 is door WICG een concept toegevoegd voor Tekstfragmenten, en nu kun je naar tekst op een pagina linken alsof je ernaar zoekt door het volgende aan de hash toe te voegen

#:~:text=<Text To Link to>

Werkvoorbeeld op Chrome Version 81.0.4044.138:

Klik op deze linkMoet de pagina opnieuw laden en markeren de tekst van de link


Antwoord 6, autoriteit 4%

Je hebt twee opties:

U kunt als volgt een anker in uw document plaatsen:

<a name="ref"></a>

Of je geeft een id aan een willekeurig HTML-element:

<h1 id="ref">Heading</h1>

Voeg vervolgens de hash #reftoe aan de URL van uw link om naar de gewenste referentie te gaan. Voorbeeld:

<a href="document.html#ref">Jump to ref in document.html</a>

Antwoord 7

Op voorwaarde dat elk element het id-attribuut op een webpagina heeft.
Men zou eenvoudig kunnen linken/springen naar het element waarnaar wordt verwezen door de tag.

Binnen dezelfde pagina:

<div id="markOne"> ..... </div> 
   ......
<a href="#markOne">Jump to markOne</a> 

Andere pagina:

<div id="http://randomwebsite.com/mypage.html#markOne"> 
  Jumps to the markOne element in the mypage of the linked website
</div>

De doelen hebben niet noodzakelijk een ankerelement.

Je kunt deze viooleens bekijken.

Other episodes