suchen
HeimWeb-Frontendjs-TutorialZusammenfassung 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

<script>-Tags sollten paarweise erscheinen und JavaScript-Code zwischen <script></script> schreiben.


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(, , )


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


.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 , ,

usw. allesamt Elementknoten, also Beschriftungen.


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

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

    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

    Stellungnahme
    Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
    Python gegen JavaScript: Eine vergleichende Analyse für EntwicklerPython gegen JavaScript: Eine vergleichende Analyse für EntwicklerMay 09, 2025 am 12:22 AM

    Der Hauptunterschied zwischen Python und JavaScript sind die Typ -System- und Anwendungsszenarien. 1. Python verwendet dynamische Typen, die für wissenschaftliche Computer- und Datenanalysen geeignet sind. 2. JavaScript nimmt schwache Typen an und wird in Front-End- und Full-Stack-Entwicklung weit verbreitet. Die beiden haben ihre eigenen Vorteile bei der asynchronen Programmierung und Leistungsoptimierung und sollten bei der Auswahl gemäß den Projektanforderungen entschieden werden.

    Python vs. JavaScript: Auswählen des richtigen Tools für den JobPython vs. JavaScript: Auswählen des richtigen Tools für den JobMay 08, 2025 am 12:10 AM

    Ob die Auswahl von Python oder JavaScript vom Projekttyp abhängt: 1) Wählen Sie Python für Datenwissenschafts- und Automatisierungsaufgaben aus; 2) Wählen Sie JavaScript für die Entwicklung von Front-End- und Full-Stack-Entwicklung. Python ist für seine leistungsstarke Bibliothek in der Datenverarbeitung und -automatisierung bevorzugt, während JavaScript für seine Vorteile in Bezug auf Webinteraktion und Full-Stack-Entwicklung unverzichtbar ist.

    Python und JavaScript: Verständnis der Stärken der einzelnenPython und JavaScript: Verständnis der Stärken der einzelnenMay 06, 2025 am 12:15 AM

    Python und JavaScript haben jeweils ihre eigenen Vorteile, und die Wahl hängt von den Projektbedürfnissen und persönlichen Vorlieben ab. 1. Python ist leicht zu erlernen, mit prägnanter Syntax, die für Datenwissenschaft und Back-End-Entwicklung geeignet ist, aber eine langsame Ausführungsgeschwindigkeit hat. 2. JavaScript ist überall in der Front-End-Entwicklung und verfügt über starke asynchrone Programmierfunktionen. Node.js macht es für die Entwicklung der Vollstapel geeignet, die Syntax kann jedoch komplex und fehleranfällig sein.

    JavaScripts Kern: Ist es auf C oder C aufgebaut?JavaScripts Kern: Ist es auf C oder C aufgebaut?May 05, 2025 am 12:07 AM

    JavaScriptisnotbuiltoncorc; Es ist angehört, dass sich JavaScriptWasdedeSthatrunsonGineoFtencninc.

    JavaScript-Anwendungen: Von Front-End bis Back-EndJavaScript-Anwendungen: Von Front-End bis Back-EndMay 04, 2025 am 12:12 AM

    JavaScript kann für die Entwicklung von Front-End- und Back-End-Entwicklung verwendet werden. Das Front-End verbessert die Benutzererfahrung durch DOM-Operationen, und die Back-End-Serveraufgaben über node.js. 1. Beispiel für Front-End: Ändern Sie den Inhalt des Webseitentextes. 2. Backend Beispiel: Erstellen Sie einen Node.js -Server.

    Python vs. JavaScript: Welche Sprache sollten Sie lernen?Python vs. JavaScript: Welche Sprache sollten Sie lernen?May 03, 2025 am 12:10 AM

    Die Auswahl von Python oder JavaScript sollte auf Karriereentwicklung, Lernkurve und Ökosystem beruhen: 1) Karriereentwicklung: Python ist für die Entwicklung von Datenwissenschaften und Back-End-Entwicklung geeignet, während JavaScript für die Entwicklung von Front-End- und Full-Stack-Entwicklung geeignet ist. 2) Lernkurve: Die Python -Syntax ist prägnant und für Anfänger geeignet; Die JavaScript -Syntax ist flexibel. 3) Ökosystem: Python hat reichhaltige wissenschaftliche Computerbibliotheken und JavaScript hat ein leistungsstarkes Front-End-Framework.

    JavaScript -Frameworks: Stromversorgung moderner WebentwicklungJavaScript -Frameworks: Stromversorgung moderner WebentwicklungMay 02, 2025 am 12:04 AM

    Die Kraft des JavaScript -Frameworks liegt in der Vereinfachung der Entwicklung, der Verbesserung der Benutzererfahrung und der Anwendungsleistung. Betrachten Sie bei der Auswahl eines Frameworks: 1. Projektgröße und Komplexität, 2. Teamerfahrung, 3. Ökosystem und Community -Unterstützung.

    Die Beziehung zwischen JavaScript, C und BrowsernDie Beziehung zwischen JavaScript, C und BrowsernMay 01, 2025 am 12:06 AM

    Einführung Ich weiß, dass Sie es vielleicht seltsam finden. Was genau muss JavaScript, C und Browser tun? Sie scheinen nicht miteinander verbunden zu sein, aber tatsächlich spielen sie eine sehr wichtige Rolle in der modernen Webentwicklung. Heute werden wir die enge Verbindung zwischen diesen drei diskutieren. In diesem Artikel erfahren Sie, wie JavaScript im Browser ausgeführt wird, die Rolle von C in der Browser -Engine und wie sie zusammenarbeiten, um das Rendern und die Interaktion von Webseiten voranzutreiben. Wir alle kennen die Beziehung zwischen JavaScript und Browser. JavaScript ist die Kernsprache der Front-End-Entwicklung. Es läuft direkt im Browser und macht Webseiten lebhaft und interessant. Haben Sie sich jemals gefragt, warum Javascr

    See all articles

    Heiße KI -Werkzeuge

    Undresser.AI Undress

    Undresser.AI Undress

    KI-gestützte App zum Erstellen realistischer Aktfotos

    AI Clothes Remover

    AI Clothes Remover

    Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

    Undress AI Tool

    Undress AI Tool

    Ausziehbilder kostenlos

    Clothoff.io

    Clothoff.io

    KI-Kleiderentferner

    Video Face Swap

    Video Face Swap

    Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

    Heiße Werkzeuge

    MantisBT

    MantisBT

    Mantis ist ein einfach zu implementierendes webbasiertes Tool zur Fehlerverfolgung, das die Fehlerverfolgung von Produkten unterstützen soll. Es erfordert PHP, MySQL und einen Webserver. Schauen Sie sich unsere Demo- und Hosting-Services an.

    Herunterladen der Mac-Version des Atom-Editors

    Herunterladen der Mac-Version des Atom-Editors

    Der beliebteste Open-Source-Editor

    DVWA

    DVWA

    Damn Vulnerable Web App (DVWA) ist eine PHP/MySQL-Webanwendung, die sehr anfällig ist. Seine Hauptziele bestehen darin, Sicherheitsexperten dabei zu helfen, ihre Fähigkeiten und Tools in einem rechtlichen Umfeld zu testen, Webentwicklern dabei zu helfen, den Prozess der Sicherung von Webanwendungen besser zu verstehen, und Lehrern/Schülern dabei zu helfen, in einer Unterrichtsumgebung Webanwendungen zu lehren/lernen Sicherheit. Das Ziel von DVWA besteht darin, einige der häufigsten Web-Schwachstellen über eine einfache und unkomplizierte Benutzeroberfläche mit unterschiedlichen Schwierigkeitsgraden zu üben. Bitte beachten Sie, dass diese Software

    WebStorm-Mac-Version

    WebStorm-Mac-Version

    Nützliche JavaScript-Entwicklungstools

    EditPlus chinesische Crack-Version

    EditPlus chinesische Crack-Version

    Geringe Größe, Syntaxhervorhebung, unterstützt keine Code-Eingabeaufforderungsfunktion