Detaillierte Erläuterung gängiger Funktionsbeispiele für Front-End-Methoden

Dieser Artikel enthält hauptsächlich detaillierte Beispiele für gängige Methoden und Funktionen im Front-End-Schreibprozess. Ich hoffe, dass er allen helfen kann.

1. push()-Methode

Definition und Verwendung
push()-Methode fügt am Ende einen Wert hinzu das Array oder mehrere Elemente und gibt die neue Länge zurück.

Syntax

arrayObject.push(newelement1,newelement2,....,newelementX)。

Rückgabewert
Die neue Länge nach dem Hinzufügen des angegebenen Werts zum Array.

Erklärung
Die push()-Methode kann ihre Parameter nacheinander am Ende von arrayObject hinzufügen. Es ändert das ArrayObject direkt, anstatt ein neues Array zu erstellen. Die push()-Methode und die pop()-Methode verwenden die vom Array bereitgestellte First-in-Last-Pop-Funktion.

Tipps und Hinweise
Hinweis: Diese Methode ändert die Länge des Arrays.
Tipp: Um ein oder mehrere Elemente am Anfang des Arrays hinzuzufügen, verwenden Sie die Methode unshift().

2. Lokaler Speicher localStorage

Daten lokal speichern

    const info = {
        name: 'Lee',
        age: 20,
        id: '001'
    };
    sessionStorage.setItem('key', JSON.stringify(info));
    localStorage.setItem('key', JSON.stringify(info));

Daten aus dem lokalen Speicher abrufen

    var data1 = JSON.parse(sessionStorage.getItem('key'));    var data2 = JSON.parse(localStorage.getItem('key'));

Gespeicherte Daten aus dem lokalen Speicher löschen Daten

    sessionStorage.removeItem('key');
    localStorage.removeItem('key');

Alle gespeicherten Daten löschen

    sessionStorage.clear();
    localStorage.clear();

Auf lokale Speicheränderungen achten

Wird ausgelöst, wenn sich der Speicher ändert (Hinzufügen, Aktualisieren, Löschen). Es werden nur andere Seiten unter demselben Domainnamen überwacht, um den Speicher zu ändern

    window.addEventListener('storage', function (e) {
        console.log('key', e.key);        console.log('oldValue', e.oldValue);        console.log('newValue', e.newValue);        console.log('url', e.url);
    })

3 . Eingabe

Nach dem Klicken den blauen Rand entfernen

 1、在顶部style中直接控制css样式：<style type="text/css">

       input{outline:none;}</style>2、直接用 input:focus { outline: none; } 控制聚焦时不出现蓝色边框~

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung gängiger Funktionsbeispiele für Front-End-Methoden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!