Alphabet in einer Reihe

[Regina Schlaukug]

a ist für Links zu anderen Seiten (bzw. anderen Ressourcen), button ist für Aktionen auf der bestehenden Seite.

Um einen Anker auf derselben Seite zu erreichen, benutzt man <a href="#anker">, anstatt irgendwas mit button zu veranstalten.

und es werden nur Einträge angezeigt, die mit einem A beginnen usw....

5000 Einträge dürften zwar arg viel sein für eine einzelne Seite, eventuell sollen auch mehrere Gruppen gleichzeitig angezeigt werden ("Einträge mit D und F"), aber trotzdem als Anregung für einen ganz einfachen Anzeigefilter:

Mittels :target lassen sich CSS-seitig Elemente abhängig vom aktiven Anker ein- oder ausblenden, ganz ohne zusätzliche Hilfe von Javascript oder serverseitigen Filtern und ständigem Nachladen. :target steht für das Element, dessen id-Attribut dem Anker in der URL entspricht.

<section id="a">
<h1><a href="#a">A</a></h1>
<ol><li>Apfel</li><li>Ananas</li></ol>
</section>

<section id="b">
<h1><a href="#b">B</a></h1>
<ol><li>Banane</li><li>Birne</li></ol>
</section>

<section id="c">
<h1><a href="#c">C</a></h1>
<ol><li>Citrone mit C</li></ol>
</section>

Mit

section > ol {
  display:none;
}
section:target > ol {
  display:block;
}

sind jeweils nur die Abschnittstitel (hier als h1) zu sehen sowie der gerade über die URL ausgewählte Abschnitt (hier als ol). Die URLs dazu lauten ganz simpel beispiel.html#a, beispiel.html#b, etc.