JavaEinheit: Script-Grundlagen in HTML - Teil 1

JavaEinheit: Script-Grundlagen in HTML

Gymnasium | Mittlere Schulformen

Informatik & Medienbildung

9. | 10. Klasse

10 Unterrichtsstunden

Beschreibung

Um Besucherinnen und Besuchern eine Webseite ein „Gefällt mir“ oder „Teilen“ zu bieten, müssen Webentwicklerinnen und Webentwickler JavaScript beherrschen. In diesem Lerninhalt werden die Schülerinnen und Schüler in die Grundlagen der weltweitführenden Web-Entwicklungssprache JavaScript eingeführt. Sie lernen, wie man JavaScript in HTML einbettet. In diesem ersten Teil werden neben der Einführung in Funktionen auch Events vermittelt.
Leseprobe ansehen
# internet
# html
# javascript
# webentwicklung
# algorithmen
# kontrollstrukturen
# webseite

Kompetenzen

Klassenstufe:9/10, Sek. II
Dauer:10 Unterrichtsstunden
Lernziele:Die Lernenden … 1. entwickeln auf Grundlage von JavaScript ein Verständnis für dynamische Benutzerinteraktionen, 2. implementieren algorithmische Grundstrukturen für Webseiten, 3. übertragen deren Kenntnisse auf andere Entscheidungsprozesse.
Thematische Bereiche:Internet, HTML, JavaScript, Webentwicklung, interaktives Verhalten von Webseiten, Algorithmen, Kontrollstrukturen
Kompetenzbereiche:Implementieren, Darstellen und Interpretieren, Produzieren und Präsentieren, Analysieren und Reflektieren

Inhaltsangabe

Abkürzungen

Benötigte Materialien

  • PC/Laptop/mobiles Endgerät
  • Stifte/Notizzettel

Lektion 1

Thema:W-Fragen zu JavaScript: Was? Wozu? Wie? (90 Min.)
M 1Wozu braucht man JavaScript?
M 2Einbettung von JavaScript in HTML
M 2aMein erstes JavaScript erwacht
Benötigt:
  • M 2a - Mein Erstes Javascript Erwacht.mp4
  • M2a.2.mein-erstes-javascript-erwacht-vorlage.zip

Lektion 2

Thema:Basics in JavaScript (90 Min.)
M 3Werte und Operatoren
M 3aVertiefung: Datentypen
M 4Deklaration und Initialisierung

Lektion 3

Thema:Funktionen (90 Min.)
M 5Funktionen in JavaScript
M 5aÜbungen zum Thema JS-Funktionen
Benötigt:
  • M5a.uebung3-datum-vorlage.zip
  • M5a.uebung4-gradkonverter-vorlage.zip

Lektion 4

Thema:Events & DOM (90 Min.)
M 6Events in JavaScript
M 7HTML bewusst nutzen, manipulieren oder interagieren

Lektion 5

Thema:Zwischenfazit: Eingeben – Verarbeiten – Ausgeben (90 Min.)
M 7aEingeben – Verarbeiten – Ausgeben
M 7bInfokarte: Schrittfolge beim JavaScript-Handling
Benötigt:
  • M7b.JavaScript-Zusammenfassung.pdf

Benötigte Dateien

  • Link: Sammlung aller Programmcode-Vorlagen und Lösungen – https://editor.p5js.org/mirkoschiller/collections/h_oQOYblN
  • Video: M 2a – Mein Erstes JavaScript Erwacht.mp4
  • Programmcode: M2a.2.mein-erstes-javascript-erwacht-vorlage.zip
  • Programmcode: M5a.uebung3-datum-vorlage.zip
  • Programmcode: M5a.uebung4-gradkonverter-vorlage.zip
  • Infokarte: M7b.JavaScript-Zusammenfassung.pdf

Ergänzendes Material

  • Programmcode: M5a.begruessung-lsg.html
  • Programmcode: M5a.farbwechsel-lsg.html
  • Programmcode: M5a.uhrzeit-lsg.html
  • Programmcode: M5a.wochentag-lsg.html
  • Programmcode: M5a.zaehlen-lsg.html
  • Programmcode: M6a.1.span-lsg.html
  • Programmcode: M6a.2.alert-bei-mausschwebe-lsg.html
  • Programmcode: M6a.3.paragraphen-aendern-lsg.html
  • Programmcode: M6a.4.bild-vergroessern-lsg.html
  • Programmcode: M6a.5.nachricht-verlassen-lsg.html
  • Programmcode: M6a.5.nachricht-verlassen-lsg-alternative.html
  • Programmcode: M7.1-neuerDiv-lsg.html
  • Programmcode: M7.2-URL-lsg.html
  • Programmcode: M7a.1-taschenrechner-lsg.zip
  • Programmcode: M7a.2-rechtecksberechnung-lsg.zip
  • Programmcode: M7a.3-kreisumfang-lsg.zip

Erklärung zu den Symbolen

0,00 €

Für Schulen & Fachschaften

Egal ob einzelne Fachschaft oder komplette Schule: Mit unseren flexiblen Abo-Modellen finden wir den richtigen Weg, um den Unterricht von Ihnen und Ihres Kollegiums einfach zu gestalten.

Jetzt informieren