Inhalte ausblenden

[Gunnar Bittersmann]

@@Meowsalot

Nehmen wir solch einen Button (bspw. <button id="filter" aria-pressed="false">), der sein aria-pressed-Attribut zwischen "true" und "false" umschaltet.

Wie kann ich den Button dazu bringen dass er auf true setzt?

Das tut er.

BTW: const toggle = document.querySelector('[aria-pressed]'); würde ich so nicht verwenden. Das selektiert den ersten Toggle-Button auf der Seite, in deinem Fall also den einen. Was aber, wenn du mehrere davon hast?

Da dein Toggle-Button eine ID hat, kannst du ihn anhand derer selektieren. Und ich würde die Variable auch entsprechend benennen, bspw:

const filterButtonElement = document.querySelector('#filter');

Was er noch nicht tut: beim Element mit der ID "einträge" das data-filtered-Attribut entsprechend setzen. Das müsstest du noch ergänzen.

EDIT: Ich habe jetzt das JavaScript eingefügt.

Das macht so keinen Sinn:

const button = document.querySelector('button'); Wozu? Du hast bereits eine Referenz auf das Button-Objekt. Wozu nochmal denselben Button selektieren und noch in einer anderen Variablen ablegen?

Außerdem macht die Änderung des Textes so keinen Sinn. Bis zum Abschnitt Changing Labels warst du nicht vorgedrungen? Darin beschreibt Heydon die Problematik.

LLAP 🖖