Wie kann der Menü- und Seitenstatus nach dem Neuladen der Seite mithilfe von Speicher beibehalten werden?

Menüstatus nach dem Neuladen der Seite beibehalten

Um den Status des Menüs nach dem Neuladen der Seite beizubehalten, können Sie den lokalen Speicher nutzen. So geht's:

1. Menüstatus speichern: Verwenden Sie JavaScripts localStorage, um den aktuellen Menüstatus zu speichern, einschließlich der übersetzten Position des angeklickten Menülinks.

<code class="javascript">// Assuming you have identified the clicked menu link as `clickedLink`
localStorage.setItem('menuState', clickedLink.id);</code>

2. Menüstatus beim Laden der Seite abrufen: Rufen Sie beim nachfolgenden Laden der Seite den gespeicherten Menüstatus aus localStorage ab.

<code class="javascript">const menuState = localStorage.getItem('menuState');</code>

3. Menüstatus wiederherstellen: Stellen Sie den Menüstatus wieder her, indem Sie die übersetzte Position des in menuState angegebenen Menülinks festlegen.

<code class="javascript">if (menuState) {
  const clickedLink = document.getElementById(menuState);
  clickedLink.classList.add('clicked', 'hovered');
  // Adjust translation and other styles accordingly.
}</code>

4. Seitenstatus beibehalten: Wenn Sie auch die aktuelle Seite beibehalten möchten, können Sie die Seitennummer in localStorage speichern. Rufen Sie es auf ähnliche Weise ab und stellen Sie es wieder her.

<code class="javascript">// Assuming you have a variable `currentPage` to store the current page
localStorage.setItem('pageState', currentPage);

const pageState = localStorage.getItem('pageState');
if (pageState) {
  currentPage = pageState;
  // Adjust page content and navigation state accordingly.
}</code>

5. Menüstatus löschen: Bei Bedarf können Sie den Menüstatus löschen, indem Sie die Variable localStorage entfernen. Dies kann beim Abmelden oder beim Navigieren zu einem anderen Abschnitt der Website erfolgen.

<code class="javascript">localStorage.removeItem('menuState');
localStorage.removeItem('pageState');</code>

Vor- und Nachteile von Speicherorten

• Lokaler Speicher:

  • Vorteile:

    • Persistent über Browsersitzungen hinweg
    • Einfach zu verwenden

  • Nachteile:

    • Zugriff auf alle Skripte auf der Seite
    • Begrenzte Speicherkapazität

• Serverseitiger Speicher:

  • Vorteile:

    • Sicherer als lokaler Speicher
    • Kann von mehreren Geräten aus aufgerufen werden

  • Nachteile:

    • Erfordert Servereinrichtung und -wartung
    • Kann eingeführt werden Latenz beim Seitenladen und bei der Leistung

Das obige ist der detaillierte Inhalt vonWie kann der Menü- und Seitenstatus nach dem Neuladen der Seite mithilfe von Speicher beibehalten werden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!