Zusammenfassung der Wissenspunkte in der JavaScript-Einführungsreihe_Javascript-Fähigkeiten

JavaScript ist eine wörtliche Skriptsprache. Es handelt sich um eine dynamisch typisierte, schwach typisierte, prototypbasierte Sprache mit integrierter Unterstützung für Typen. Sein Interpreter heißt JavaScript-Engine, ist Teil des Browsers und wird häufig in clientseitigen Skriptsprachen verwendet. Er wurde erstmals auf HTML-Webseiten (einer Anwendung unter Standard Universal Markup Language) verwendet, um HTML-Webseiten dynamische Funktionen hinzuzufügen . .

1. Vorbereitung:

1. Warum JavaScript lernen

Alle gängigen Browser unterstützen nur Javascript

Die meisten Webseiten verwenden Javascript

Es kann Webseiten mit verschiedenen dynamischen Effekten versehen

Einfach zu erlernen

2. So fügen Sie JS ein

3f1c4e4b6b16bbbd69b2ee476dc4f83a-Tags sollten paarweise erscheinen und JavaScript-Code zwischen 3f1c4e4b6b16bbbd69b2ee476dc4f83a2cacc6d41bbb37262a98f745aa00fbf0 schreiben.

4ec11beb6c39d0703d1751d203c17053 bedeutet, dass der Texttyp (Text) zwischen 3f1c4e4b6b16bbbd69b2ee476dc4f83a2cacc6d41bbb37262a98f745aa00fbf0 verwendet wird, um dem Browser mitzuteilen, dass der darin enthaltene Text zur JavaScript-Sprache gehört.

3. Referenzieren Sie externe JS-Dateien

Sie können die HTML-Datei und den JS-Code trennen und eine separate JavaScript-Datei (kurz JS-Datei) erstellen. Das Dateisuffix lautet normalerweise .js
In der JS-Datei ist das 3f1c4e4b6b16bbbd69b2ee476dc4f83a-Tag nicht erforderlich. Schreiben Sie einfach JavaScript-Code direkt.

Code kopieren Der Code lautet wie folgt:

84cf5d7ad8199c88ca1d921cae010baf2cacc6d41bbb37262a98f745aa00fbf0

4. Die Position von JS auf der Seite

JavaScript ist eine Skriptsprache und kann überall auf der HTML-Seite platziert werden. Normalerweise platzieren wir es im Kopf- oder Textteil der Webseite. Der Browser interpretiert HTML jedoch der Reihe nach, sodass das vorherige Skript zuerst ausgeführt wird. Beispielsweise müssen die JS für die Seitenanzeigeinitialisierung im Kopf platziert werden, da die Initialisierung im Voraus erfolgen muss (z. B. CSS für den Seitenkörper festlegen usw.), und wenn die Funktion über einen Ereignisaufruf ausgeführt wird, muss sie dort platziert werden Es besteht keine Anforderung an den Standort.

5. Aussagen und Symbole

Das Format jedes JavaScript-Codes: Anweisung;

6. Anmerkungsmethode

Fügen Sie bei einzeiligen Kommentaren das Symbol „//“ vor dem Kommentarinhalt hinzu.

Mehrzeilige Kommentare beginnen mit „/*“ und enden mit „*/“.

7. Variablen

Definieren Sie Variablen mit dem Schlüsselwort var. Die Syntax lautet wie folgt:

Var-Variablenname

Der Variablenname kann beliebig benannt werden, die Benennungsregeln müssen jedoch befolgt werden:

1. Variablennamen müssen mit Buchstaben oder Unterstrichen (_) beginnen.

2. Variablennamen müssen englische Buchstaben, Zahlen und Unterstriche (_) enthalten.

3. JavaScript-Schlüsselwörter und reservierte JavaScript-Wörter können nicht in Variablennamen verwendet werden.

8. Urteilsbegründung (falls...sonst)

Syntax:

if(条件)
{ 条件成立时执行的代码 }
else
{ 条件不成立时执行的代码 }

9. Funktion

function 函数名()
{
函数代码;
}

Beschreibung:

1. Funktionsschlüsselwort definiert eine Funktion.

2. „Funktionsname“ ist der Name, den Sie der Funktion geben.

3. Ersetzen Sie „Funktionscode“ durch Code, der eine bestimmte Funktion ausführt.

Funktionsaufruf:

Nachdem eine Funktion definiert wurde, kann sie nicht automatisch ausgeführt werden. Wenn Sie sie also aufrufen müssen, schreiben Sie die Funktion einfach direkt an die gewünschte Stelle

2. Häufig verwendete Interaktionsmethoden

1. Inhalt ausgeben (document.write)

document.write() kann verwendet werden, um Inhalte direkt in den HTML-Ausgabestream zu schreiben. Vereinfacht ausgedrückt geht es darum, den Inhalt direkt auf der Webseite auszugeben.

Der erste Typ: Der Ausgabeinhalt ist in „“ eingeschlossen und der Inhalt innerhalb von „“ wird direkt ausgegeben.

Der zweite Typ: Inhalte über Variablen ausgeben

Der dritte Typ: Mehrere Inhalte ausgeben und die Inhalte mit einem +-Zeichen verbinden.

Die vierte Methode: HTML-Tags ausgeben und bearbeiten. Die Tags werden in „“ eingeschlossen.

2. Warnung (Dialogfeld mit Warnmeldung)

Es öffnet sich ein kleines Fenster mit einem Nachrichtentext (Alarm öffnet ein Nachrichtendialogfeld (einschließlich einer OK-Schaltfläche)): Alarm (Zeichenfolge oder Variable);

Hinweis:

1. Es können keine weiteren Vorgänge ausgeführt werden, bevor im Dialogfeld auf die Schaltfläche „OK“ geklickt wird.

2. Meldungsdialogfelder können normalerweise zum Debuggen von Programmen verwendet werden.

3. Inhalt der Alarmausgabe, der eine Zeichenfolge oder eine Variable sein kann, ähnlich wie document.write.

3. Bestätigen (Dialogfeld „Nachricht bestätigen“)

Ein Dialogfeld wird angezeigt (einschließlich einer Schaltfläche „OK“ und einer Schaltfläche „Abbrechen“). bestätigen(str);

Parameterbeschreibung:

str: Text, der im Nachrichtendialogfeld angezeigt werden soll

Rückgabewert: Boolescher Wert

Rückgabewert:

Wenn der Benutzer auf die Schaltfläche „OK“ klickt, wird true zurückgegeben

Wenn der Benutzer auf die Schaltfläche „Abbrechen“ klickt, wird „false“ zurückgegeben

Hinweis: Der Rückgabewert kann verwendet werden, um festzustellen, auf welche Schaltfläche der Benutzer geklickt hat

Hinweis: Das Nachrichtendialogfeld ist exklusiv, d. h. der Benutzer kann keine anderen Vorgänge ausführen, bevor er auf die Schaltfläche im Dialogfeld klickt.

4. Frage (Eingabeaufforderungsdialogfeld)

Öffnen Sie ein Nachrichtendialogfeld (einschließlich einer Schaltfläche „OK“, einer Schaltfläche „Abbrechen“ und einem Texteingabefeld) prompt(str1, str2);

Parameterbeschreibung:

str1: Der Text, der im Nachrichtendialogfeld angezeigt werden soll, kann nicht geändert werden

str2: Der Inhalt im Textfeld kann geändert werden

Rückgabewert:

1. Klicken Sie auf die Schaltfläche „OK“ und der Inhalt des Textfelds wird als Rückgabewert der Funktion verwendet

2. Wenn Sie auf die Schaltfläche „Abbrechen“ klicken, wird null zurückgegeben

Hinweis: Es können keine weiteren Vorgänge ausgeführt werden, bevor der Benutzer auf die Schaltfläche im Dialogfeld klickt.

5. Öffnen Sie ein neues Fenster (window.open)

Die open()-Methode wird verwendet, um ein neues Fenster zu öffnen: window.open(258c40d94d8689854ad79c4076dd5f96, f4ff05ef38cc7c14441c5b8006a390ae, 58c16e9f7b657b6f25b8360ff9c5dc76)

Parameterbeschreibung:

URL: URL oder Pfad zum Öffnen des Fensters.

Fenstername: Der Name des geöffneten Fensters.

Kann „_top“, „_blank“, „_selft“ usw. sein.

Parameterzeichenfolge: Fensterparameter festlegen, jeder Parameter wird durch Kommas getrennt. (oben, links, Breite, Höhe, Menüleiste, Symbolleiste, Bildlaufleisten, Status)

Hinweis:

1. Zwischen den Parametern stehen Leerzeichen und Gleichheitszeichen. Nur durch Entfernen der Leerzeichen kann sie normal ausgeführt werden.

2. Die laufenden Ergebnisse berücksichtigen Probleme mit der Browserkompatibilität.

6. Schließen Sie das Fenster (window.close)

window.close(); //Schließe das angegebene Fenster

9bf54662ab0eebf19bebd7f4139e648f.close();

3. DOM-Betrieb

1. Lernen Sie DOM kennen

Document Object Model DOM (Document Object Model) definiert Standardmethoden für den Zugriff auf und die Verarbeitung von HTML-Dokumenten. DOM rendert HTML-Dokumente als Elemente,

Baumstruktur (Knotenbaum) von Attributen und Text.

1. Elementknoten: Im obigen Bild sind 100db36a723c770d327fc0aef2ce13b1, 6c04bd5ca3fcae76e30b72ad730ca86d, e388a4556c0f65e1904146cc1a846bee usw. allesamt Elementknoten, also Beschriftungen.

2. Textknoten: Dem Benutzer angezeigter Inhalt, z. B. JavaScript, DOM, CSS und andere Texte in 25edfb22a4f469ecb59f1190150159c6...bed06894275b65c1ab86501b08a632eb.

3. Attributknoten: Elementattribut, z. B. das Linkattribut href="http://www.imooc.com" des 3499910bf9dac5ae3c52d5ede7383485

2. Elemente nach ID abrufen

document.getElementById(“id”)

Hinweis: Das erhaltene Element ist ein Objekt. Wenn wir das Element bearbeiten möchten, müssen wir seine Eigenschaften oder Methoden verwenden.

3. innerHTML-Attribut

Die Eigenschaft

.innerHTML wird verwendet, um den Inhalt eines HTML-Elements abzurufen oder zu ersetzen.

Object.innerHTML

1.Object ist das erhaltene Elementobjekt, z. B. das über document.getElementById("ID") erhaltene Element.

2. Achten Sie auf die Schreibweise, innerHTML unterscheidet zwischen Groß- und Kleinschreibung

4. HTML-Stil ändern

Object.style.property=neuer Stil;

Hinweis: Objekt ist das erhaltene Elementobjekt, z. B. das über document.getElementById("id") erhaltene Element.

Grundlegende Eigenschaftstabelle (Eigenschaft);

Hintergrundfarbe/Höhe/Breite/Farbe/Schriftart/Schriftfamilie/Schriftgröße

5. Ein- und Ausblenden (Anzeigeattribut)

Object.style.display = value

Hinweis: Objekt ist das erhaltene Elementobjekt, z. B. das über document.getElementById("id") erhaltene Element.

Wert:

keine: Dieses Element wird nicht angezeigt (ausgeblendet)

Block: Dieses Element wird als Element auf Blockebene angezeigt (Anzeige)

6. Kontrollklassenname (className-Attribut)

Legen Sie das Klassenattribut des Elements fest oder geben Sie es zurück

object.className = Klassenname

1. Rufen Sie das Klassenattribut des Elements ab

2. Geben Sie einen CSS-Stil für ein Element auf der Webseite an, um das Erscheinungsbild des Elements zu ändern