JavaScript 1 2 Grundlagen Tipps Bausteine Links

Zusammen mit der Programmiersprache Java erblickte JavaScript (LiveScript) Ende 1995 das Licht der Welt. Mittlerweile ist aus der einfachen Scriptsprache JavaScript eine komplette Programmiersprache geworden, die durch ihre Einfachheit besticht.

Heutzutage beinhalten nahezu alle Webseiten JavaScript, eine Skriptsprache welche in Ihrem Browser läuft. Sie hilft dabei Webseiten für bestimmte Zwecke funktional zu gestalten. Mit JavaScript können Sie z.B. auf HTML-Elemente zugreifen und diese dann dynamisch anpassen.

[Bildschirmfoto / Grafik]
 JavaScript im Einsatz

Inzwischen ist durch die Kombination mit anderen Programmiersprachen z.B. PHP, diese Scriptsprache in weiter entwickelter Form als AJAX (Asynchronous JavaScript and XML) oder mit dem JavaScript-Framework jQuery bekannt und zu größerer Bedeutung gelangt.

Um nun die JavaScript-Anweisungen richtig einsetzen zu können finden sich dazu zahlreiche Dokumentationen im Web. Das bekannte deutsche selfHTML , das englischsprachige w3schools.com und das Mozilla Developer Network.

• In der Linkliste finden Sie weitere Links zum Thema JavaScript.

Abonniere meinen RSS-Feed um über aktuelle Seiten benachrichtigt zu werden.

Grundlagen

Quelltext mit Format
Es gibt gute Gründe einen Quelltext zu formatieren und zu kommentieren.
Quelltext mit Format

Escape-Zeichen - (Escape-Codes) Formatierung von auszugebenden Texten in JavaScript und PHP.

Escape-Zeichen
Tastureingaben und Mausaktionen mit JavaScript Aktualisiert
Tastatur-Ereignisse (Objekte) beschreiben eine Benutzerinteraktion mit der Tastatur (Keyboard), jede Eingabe beschreibt dabei ein Ereignis.
Tastureingaben und Mausaktionen mit JavaScript
Cookie-Kurs: Erstellen Sie ein Cookie in 5 Schritten (Tutorial)
Cookies (Kekse) machen das Web persönlicher, Cookies erkennen Homepage-Besucher wieder und ermöglichen einen individuellen Service.
Cookie-Kurs: Erstellen Sie ein Cookie in 5 Schritten
Liste der Event Handler
Event-Handler, was so viel heißt wie "Ereignis-Behandler" ist kleiner JavaScript- Code, den Sie innerhalb von HTML-Tags als Attribut platzieren. Treten bestimmte Ereignisse ein wie ein Mausklick oder Tastendruck, leitet ein Event-Handler bestimmte Aktionen ein.
CSS in JavaScript
CSS-Klasse in JavaScript setzen und entfernen. Liste der JavaScript Schreibweisen
Mit JavaScript auf HTML-Elemente zugreifen
Um mit JavaScript auf HTML-Elemente zugreifen zu können gibt es verschiedene Möglichkeiten.
Mit JavaScript auf HTML-Elemente zugreifen

Tipps

Hier finden Sie nützliche und interessante JavaScript Beispiele. Diese müssen eventuell den eigenen Wünschen angepasst werden, dazu sind allerdings Kenntnisse in JavaScript notwendig!

ToDo-Liste mit JavaScript Neu
Die im Formular eingetragenen Daten per JavaScript: localStorage() im Browser des Benutzers hinterlegen, auslesen und löschen.
ToDo-Liste mit JavaScript
Seiteninhalt mit JavaScript verstecken und wieder anzeigen
Manchmal wird eine Funktion benötigt um Texte, Bilder, etc. erst anzuzeigen wenn der Benutzer auf einen Link klickt.
Formular über AJAX erstellen und Daten versenden
Formulardaten über AJAX überprüfen und speichern ✶✶✶
Ohne lästigen Seitenwechsel werden die eingegebenen Daten im Formular überprüft und gespeichert.
Sortierkasten Zum Herunterladen ✶✶✶✶
Objekte über Ziehen und Ablegen (drag & drop) sortieren und die Änderung in einer Datenbank (SQLite-Datei) speichern. Mit diesem Script können verschiedene Dinge und Sachen (Namen von Fußballspielern, Produkten, etc.) sortiert werden. Es sind bis zu 25 Ablageflächen möglich in denen etwas abgelegt werden kann.
Sortierkasten - Objekte über 'Ziehen und Ablegen' sortieren
Diashow aufgebohrt Tipp ✶✶✶
Oft sind Diashows mit JavaScript sehr komplex aufgebaut, der Anwender muss im JavaScript-Code die Bilder für die Diashow eintragen oder die Geschwindigkeit etc. anpassen.
Diashow aufgebohrt
Mit dieser autom. Diashow werden Bilder und Beschreibungen aus einer HTML-Aufzählungsliste über JavaScript ausgelesen und angezeigt. Der Vorteil wenn man weitere Bilder hinzufügt ist, das nur die Aufzählungsliste erweitert werden muss.
Mit JavaScript und Canvas zeichnen ✶✶✶✶
Mit JavaScript und Canvas können Sie alle Arten von Grafiken zeichnen von einfachen Linien bis zu komplexen grafischen Objekten, durch JavaScript sind sogar Animationen möglich. Diese kleine Anleitung vermittelt die Grundlagen die für die Erstellung von Grafiken mit JavaScript benötigt werden.
Datenschutz-Hinweis über Cookies dauerhaft ausblenden ✶✶✶
Hier zeige ich, wie der Datenschutz-Hinweis über Cookies (LocalStorage) dauerhaft ausgeblendet werden kann.
Datenschutz-Hinweis über Cookies dauerhaft ausblenden
Artikel über Checkboxen auswählen ✶✶✶✶
Hier können Artikel (Bilder) ausgewählt werden die bestimmte Kriterien der Checkboxen erfüllen. Die Daten werden in einer CSV-Datei gespeichert und können individuell angepasst werden.
Artikel über Checkboxen auswählen
Benutzereingaben mit JavaScript lokal speichern ✶✶✶✶
HTML 5 bietet uns die Möglichkeit, mittels des JavaScript: localStorage() einfache Daten im Browser zu speichern. Auch wenn man zwischendurch weg surft und dann wieder kommt sind die Daten noch auslesbar.
Benutzereingaben mit JavaScript lokal speichern
Browser-Sprachumschaltung ✶✶✶
Diese Sprachumschaltung zeigt je nach der verwendeten Sprache (deutsch, englisch, ...) im Browser unterschiedlichen Inhalt an.
Browser-Sprachumschaltung
Bilder in den Browser laden per File API Tipp ✶✶✶✶
Wenn Bilder hoch geladen werden sollen, ist es für dem Benutzer wissenswert welche Bilder er überhaupt ausgewählt hat. Diese JavaScript-Funktion zeigt Bilder vor dem hochladen im Browser an.
Bilder in den Browser laden per File API
Verkettete Auswahllisten dynamisch aus einer DB-Tabelle generieren Tipp ✶✶✶✶
Dieses Beispiel zeigt, wie man eine HTML-Auswahlliste (Drop-Down-Liste) dynamisch generiert, die auf den Werten einer Spalte in einer Datenbank-Tabelle beruht.
Verkettete Auswahllisten dynamisch aus einer DB-Tabelle generieren
Mit JSON Daten zwischen JavaScript und PHP austauschen ✶✶✶
JSON, ist ein kompaktes Datenformat in einer einfach lesbaren Textform zum Zweck des Datenaustauschs zwischen Anwendungen.
Mit JSON Daten zwischen JavaScript und PHP austauschen

JavaScript-Bausteine (Alphabetische Sortierung)  Alle Anzeigen

1  A  B  C  D  E  F  G  H  I  J  L  M  N  O  P  R  S  T  Ü  U  V  W  Z 
    1
  1. 1 x Klick Button
  2. A
  3. Alle Checkboxen auf einmal auswählen
  4. Anzahl der HTML-Tags
  5. Anzahl der markierten Checkboxen anzeigen Neu
  6. Anzahl der Wörter als Fortschrittsbalken anzeigen
  7. Audiodatei in JavaScript verstecken
  8. Audiodateien per Button-Klick abspielen Neu
  9. Ausgabe des aktuellen Datums
  10. Ausgabe des aktuellen Datums mit Monats- und Tagesnamen
  11. Ausgabe zeitlich steuern
  12. Auslesen der Benutzer-Zeitzone Neu
  13. Autom. Überprüfung der Eingabe
  14. Automatische Weiterleitung nach einigen Sekunden
  15. B
  16. BB-Code in einem Textarea einfügen
  17. Bei der Eingabe eines Datums die Punkte automatisch hinzufügen
  18. Beim Anklicken einer Checkbox den dazugehörenden Text hervorheben
  19. Bestimmte Textstellen markieren
  20. Bild mit dem Mausrad vergrößern
  21. Bilder Zoom-Funktion
  22. Bildschirm und Fenstergröße ermitteln
  23. Browser Infos
  24. C
  25. Checkbox auf "unbestimmt" setzen
  26. Checkboxen JavaScript-Funktion zuweisen
  27. Confirm()
  28. Cookies aktiv
  29. Cookies setzen und löschen
  30. Count-Up Anzeige für Personen, Dinge etc.
  31. Countdown
  32. CountDown (2)
  33. Countdown (3)
  34. CountUp
  35. CSS über Javascript einbinden
  36. D
  37. Darstellungsmodus überprüfen
  38. Das gewählte Datum plus 30 Tage errechnen
  39. Dateiname ermitteln
  40. Datenbank-Inhalt an ein JavaScript (Array) übergeben
  41. Datum und Uhrzeit als Zeichenkette anzeigen
  42. Den Wert des ausgewählten Optionsfelds auslesen Neu
  43. Dialog mit dem Computer Neu
  44. Die aktuelle Fenstergröße ermitteln
  45. Die Höhe eines IFrames automatisch dem Inhalt anpassen
  46. Die Position eines Schiebereglers speichern und auslesen
  47. Die Textauswahl in Zwischenablage kopieren
  48. Die Werte in Eingabefeldern per Button-Klick ändern
  49. E
  50. Ein farbig blinkender Text
  51. Eine Animation ab einer bestimmten Scroll-Position starten
  52. Eine Gruppe von Bildern markieren
  53. Einfügemarke im Textarea bewegen
  54. Eingabefeld bei Fehleingabe farbig markieren
  55. Eingabefeld selektieren
  56. Eingabefelder automatisch fokussieren
  57. Element ein- und ausblenden
  58. Entferne HTML Tags in JavaScript
  59. Erkennen ob die Feststelltaste bei der Passworteingabe eingeschaltet ist Neu
  60. Externe Datei per AJAX zeitabhängig aktualisieren Neu
  61. F
  62. Falsche Zahleneingabe ändern
  63. Farbanzeiger
  64. Formulareingabe nur mit Großbuchstaben
  65. Formularfelder dynamisch hinzufügen
  66. Formularfelder farbig markieren
  67. Fortschrittsanzeige mit JavaScript verändern
  68. Frames per Link nachladen
  69. Funktion zur zufälligen Auswahl eines Bildes aus einer Bildliste
  70. G
  71. Geburtstag anzeigen
  72. Gedrückte Taste markieren
  73. Geladenes Stylesheet austauschen
  74. Geolocation API - Bei Knopfdruck Koordianten ausgeben
  75. Großbuchstaben Test
  76. H
  77. HTML-Button über JavaScript eine Funktion zuweisen
  78. HTML-Tags in benannte Zeichen umwandeln
  79. HTML-Title Attribut tauschen
  80. HTML 5 - Pflichtfeld setzen mit JavaScript
  81. htmlEntities für JavaScript
  82. https und den Querystring aus der URL entfernen
  83. I
  84. Iframe-Inhalt zeitlich steuern
  85. Iframe alle 10 Sekunden neu laden
  86. Individuelle Fehlermeldung ausgeben
  87. J
  88. JavaScript-Version des Browsers anzeigen
  89. JavaScript über dem Form-Tag aufrufen
  90. L
  91. Langsam zum Seitenanfang scrollen Neu
  92. Leerstellen löschen
  93. Leerzeichen am Anfang und Ende einer Zeichenkette entfernen
  94. Letzte Änderung an einem Dokument ausgeben
  95. Lichtregler
  96. Löschen mit Sicherheitsabfrage
  97. M
  98. Markierten Text in ein Eingabefeld einfügen
  99. Mehrere Tastatureingaben mit Zahlen Neu
  100. Meldung mit Format
  101. N
  102. Nachfragen bevor die Seite verlassen wird
  103. Neues Fenster öffnen
  104. O
  105. Objekt eine JavaScript-Funktion zuweisen
  106. outerHTML - Quelltext anzeigen
  107. P
  108. Passwort im Klartext anzeigen
  109. Position der Einfügemarke in einem Textfeld ermitteln
  110. Prüfen, ob die Funktion vor dem Aufruf vorhanden ist
  111. Prüfen, ob die Zahl gerade oder ungerade ist
  112. R
  113. Radiobutton mit Auswahl-Hinweis
  114. S
  115. Schieberegler für Bilder
  116. Schlüssel und Wert aus einem Objekt auslesen
  117. Seite autom. jede Minute neu laden
  118. Sekundenzähler
  119. Suchen und Ersetzen
  120. T
  121. Text bei onMouseOver und onMouseOut ersetzen
  122. Text in Großbuchstaben oder Kleinbuchstaben umwandeln Neu
  123. Text mit einem Link markieren
  124. Text über ID auslesen und ändern
  125. Textteil auswählen
  126. Trim-Funktion in JavaScript
  127. Trinitätsoperator
  128. Ü
  129. Überprüfen ob ein Button gedrückt wurde
  130. U
  131. URL Query und Fragment über JavaScript auslesen
  132. V
  133. Verzögerte Umleitung mit JavaScript
  134. W
  135. Wörter in einer Zeichenkette zählen
  136. Z
  137. Zahl in einem Eingabefeld mit dem Mausrad verändern
  138. Zahl runden
  139. Zahlen aus zwei Eingabefeldern zusammenzählen
  140. Zahlen autom. addieren
  141. Zahlenwerte überprüfen und korrigieren
  142. Zeichenkontrolle
  143. Zeichnung erstellen
  144. Zeilen, Wörter und Zeichen in einem Textarea zählen
  145. Zeit-Differenz ermitteln
  146. Zeitabhängige Aktualisierung
  147. Zufallsfarbe ausgeben
  148. Zufallslink im neuen Tab/Fenster anzeigen und aktuelle Seite verlassen
  149. Zweite Auswahlliste aktivieren
  150. Zweite Checkbox mit JavaScript auswählen

Zahl in einem Eingabefeld mit dem Mausrad verändern
developer.mozilla.org ✶✶✶✶✶
JavaScript (JS) ist eine leichtgewichtige, interpretierte oder JIT-übersetzte Sprache mit First-Class-Funktion. Bekannt ist sie hauptsächlich als Skriptsprache für Webseiten geworden, jedoch wird sie auch in vielen Umgebungen außerhalb des Browsers wie zum Beispiel Node.js, Apache CouchDB und Adobe Acrobat eingesetzt.
javascripttutorial.net ✶✶✶✶✶
JavaScript Tutorial (englisch)
jquery.com ✶✶✶✶
jQuery ist ein freies, umfangreiches JavaScript-Framework (englisch).
molily.de ✶✶✶✶
Dokumentation der Programmiersprache JavaScript. Sie richtet sich an Einsteiger, soll dem Leser aber nach und nach alle wichtigen Aspekte des JavaScript-Einsatzes bei der Webseiten-Entwicklung nahe bringen.
w3schools.com ✶✶✶✶
JavaScript Tutorial (englisch)
j-berkemeier.de ✶✶✶✶✶
Kleines Javascript, mit dem HTML-Tabellen im Browser sortiert werden können, ohne dass die Datei jedesmal neu geladen werden muss.
javascript.info ✶✶✶✶✶
JavaScript Tutorial (englisch).
the-art-of-web.com ✶✶✶✶✶
JavaScript | The Art of Web (englisch)
kostenlose-javascripts.de
Viele JavaScripte nach Kategorien sortiert.
jswelt.de
Ein gutes JavaScript-Archiv.
ajaxschmiede.de
Ajaxschmiede.de - Der Blog über Ajax und Web2.0

Alle Links mit Bewertungen anzeigen
In die Linkliste eintragen

JavaScript - Seite 1 2