JavaScript ❶ Grundlagen Tipps Bausteine

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.

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.

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

Tastureingaben (Key Codes) für JavaScript

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.

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!

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.
Diashow aufgebohrt ✶✶✶
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 localStorage oder sessionStorage einfache Daten im Browser zu 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 ✶✶✶✶
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 ✶✶✶✶
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
Formulardaten über AJAX überprüfen und speichern ✶✶✶
Ohne lästigen Seitenwechsel werden die eingegebenen Daten im Formular überprüft und gespeichert.
Weitere Tipps finden Sie auf Seite ❶

JavaScript-Bausteine (Alphabetische Sortierung)

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. Ausgabe des aktuellen Datums
  6. Ausgabe des aktuellen Datums mit Monats- und Tagesnamen
  7. Ausgabe zeitlich steuern
  8. Autom. Überprüfung der Eingabe
  9. Automatische Weiterleitung nach einigen Sekunden
  10. B
  11. BB-Code in einem Textarea einfügen
  12. Bei der Eingabe eines Datums die Punkte automatisch hinzufügen
  13. Beim Anklicken einer Checkbox den dazugehörenden Text hervorheben
  14. Bilder Zoom-Funktion
  15. Bildschirm und Fenstergröße ermitteln
  16. Browser Infos
  17. C
  18. Checkbox auf "unbestimmt" setzen
  19. Checkboxen JavaScript-Funktion zuweisen
  20. Confirm()
  21. Cookies aktiv
  22. Count-Up Anzeige für Personen, Dinge etc.
  23. Countdown
  24. CountDown (2)
  25. Countdown (3)
  26. CountUp
  27. CSS über Javascript einbinden
  28. D
  29. Darstellungsmodus überprüfen
  30. Dateiname ermitteln
  31. Datenbank-Inhalt an ein JavaScript (Array) übergeben
  32. Datum und Uhrzeit als Zeichenkette anzeigen
  33. Die aktuelle Fenstergröße ermitteln
  34. Die Höhe eines IFrames automatisch dem Inhalt anpassen
  35. Die Textauswahl in Zwischenablage kopieren
  36. E
  37. Ein farbig blinkender Text
  38. Eine Animation ab einer bestimmten Scroll-Position starten
  39. Eine Gruppe von Bildern markieren
  40. Einfügemarke im Textarea bewegen
  41. Eingabefeld bei Fehleingabe farbig markieren
  42. Eingabefeld selektieren
  43. Eingabefelder automatisch fokussieren
  44. Element ein- und ausblenden
  45. F
  46. Falsche Zahleneingabe ändern
  47. Farbanzeiger
  48. Formulareingabe nur mit Großbuchstaben
  49. Formularfelder dynamisch hinzufügen
  50. Formularfelder farbig markieren
  51. Fortschrittsanzeige mit JavaScript verändern
  52. Frames per Link nachladen
  53. Funktion zur zufälligen Auswahl eines Bildes aus einer Bildliste
  54. G
  55. Geburtstag anzeigen
  56. Gedrückte Taste markieren
  57. Geladenes Stylesheet austauschen
  58. Geolocation API - Bei Knopfdruck Koordianten ausgeben
  59. Großbuchstaben Test
  60. H
  61. HTML-Button über JavaScript eine Funktion zuweisen
  62. HTML-Tags in benannte Zeichen umwandeln
  63. HTML-Title Attribut tauschen
  64. HTML 5 - Pflichtfeld setzen mit JavaScript
  65. htmlEntities für JavaScript
  66. I
  67. Iframe-Inhalt zeitlich steuern
  68. Iframe alle 10 Sekunden neu laden
  69. Individuelle Fehlermeldung ausgeben
  70. J
  71. JavaScript-Version des Browsers anzeigen
  72. JavaScript über dem Form-Tag aufrufen
  73. L
  74. Langsam zum Seitenanfang scrollen
  75. Leerstellen löschen
  76. Leerzeichen am Anfang und Ende einer Zeichenkette entfernen
  77. Letzte Änderung an einem Dokument ausgeben
  78. Löschen mit Sicherheitsabfrage
  79. M
  80. Markierten Text in ein Eingabefeld einfügen
  81. Meldung mit Format
  82. N
  83. Nachfragen bevor die Seite verlassen wird
  84. Neues Fenster öffnen
  85. O
  86. Objekt eine JavaScript-Funktion zuweisen
  87. outerHTML - Quelltext anzeigen
  88. P
  89. Passwort im Klartext anzeigen
  90. Position der Einfügemarke in einem Textfeld ermitteln
  91. Prüfen, ob die Funktion vor dem Aufruf vorhanden ist
  92. Prüfen, ob die Zahl gerade oder ungerade ist
  93. R
  94. Radiobutton mit Auswahl-Hinweis
  95. S
  96. Schieberegler für Bilder
  97. Seite autom. jede Minute neu laden
  98. Sekundenzähler
  99. Suchen und Ersetzen
  100. T
  101. Text bei onMouseOver und onMouseOut ersetzen
  102. Text mit einem Link markieren
  103. Text über ID auslesen und ändern
  104. Textteil auswählen
  105. Trim-Funktion in JavaScript
  106. Trinitätsoperator
  107. Ü
  108. Überprüfen ob ein Button gedrückt wurde
  109. U
  110. URL Query und Fragment über JavaScript auslesen
  111. V
  112. Verzögerte Umleitung mit JavaScript
  113. W
  114. Wörter in einer Zeichenkette zählen
  115. Z
  116. Zahl runden
  117. Zahlen aus zwei Eingabefeldern zusammenzählen
  118. Zahlen autom. addieren
  119. Zahlenwerte überprüfen und korrigieren
  120. Zeichenkontrolle
  121. Zeilen, Wörter und Zeichen in einem Textarea zählen
  122. Zeitabhängige Aktualisierung
  123. Zufallsfarbe ausgeben
  124. Zufallslink im neuen Tab/Fenster anzeigen und aktuelle Seite verlassen
  125. Zweite Auswahlliste aktivieren
  126. Zweite Checkbox mit JavaScript auswählen
Diese Schlagwörter könnten Sie interessieren:
Silbentrennung Linkliste Diashow Fotoalbum Rahmen AJAX PHP-Fehlermeldungen Dateibrowser Quelltext ASCII Sortierung Zeitfunktionen Chatroom Zeitbalken Zeitansage Dynamische Seiten Wasserzeichen Webseitenschutz Seitenformatierung Formulare