öffentlich
Redaktion Druckversion

JavaScript lernen - schnell und praktisch

Praxis-Tipps zum Einsatz von JavaScript

JavaScript im Kreis der Webtechnologien

JavaScript spielt eng mit den verschiedenen Webtechnologien zusammen. Sehen wir uns erst einmal an, welche das sind:

JavaScript und HTML/CSS

JavaScript und HTML gehören fest zusammen. Wenn Sie JavaScript im Webbereich einsetzen, so werden Sie normalerweise mit JavaScript die Inhalte einer HTML-Seite ändern, neue hinzufügen oder bestehende modifizieren.

JavaScript und CSS JavaScript arbeitet aber auch eng mit CSS zusammen: Nehmen wir als Beispiel die Lightbox: Per CSS wird definiert, wie der Hintergrund verdunkelt, wie das große Bild platziert werden soll. JavaScript sorgt dafür, dass das alles per Klick auf ein kleines Bild passiert.

JavaScript und PHP

JavaScript und PHP: Wenn Sie sich noch nicht mit PHP beschäftigt haben können Sie diesen Absatz getrost überspringen. Wenn Sie hingegen bereits mit PHP programmieren, so stellt sich Ihnen vielleicht die Frage, warum Sie JavaScript einsetzen sollten, wo es doch abgeschaltet werden kann? Und ob es dann nicht gleich besser ist, auf PHP zu setzen?

  • Das kann nur Javascript:

    Zuerst einmal gibt es Dinge, die PHP von Haus aus nicht kann. Mit PHP können Sie nur etwas machen, wenn die Daten bei Ihnen auf dem Server ankommen. Sie können reagieren, wenn jemand ein Formular abgesendet hat oder auf einen Link geklickt hat - aber eben nicht vorher.

    Mit JavaScript hingegen können Sie etwas machen, während der Besucher noch auf der Seite ist: Sie können beispielsweise eine Änderung herbeiführen, wenn er über einen Bereich mit der Maus fährt, ein anderes Auswahlfeld eines Formulars auswählt, ein Kontrollkästchen anklickt etc.

    Drei konkrete Beispiele bei Formularen zeigen, was Sie nur über JavaScript, jedoch nicht mit PHP machen können:

    • Per JavaScript können Sie bei Formularen dafür sorgen, dass mehrere Kontrollkästchen auf einmal an- oder abgewählt werden.

      Ein Klick auf den Button und ...

      ... alle Kontrollkästchen sind abgewählt

    • Oder Sie können über JavaScript, je nachdem, was ein Benutzer ausgewählt hat, bestimmte Bereiche "ausgrauen". Wenn der Benutzer angibt, kein Auto zu haben, dann brauchen Sie ihn nicht nach der Marke zu fragen.

    • Zeichen zählen während des Eingebens: Wenn Sie beispielsweise bei einem Formularfeld zählen wollen, wie viel Zeichen bereits eingegeben wurden, um dem Nutzer zu sagen, wie viel Zeichen er noch eingeben kann, und zwar vor dem Absenden des Formulars, so können Sie das ebenfalls nur mit JavaScript, nicht mit PHP machen.

  • Das können sowohl PHP als auch JavaScript:

    Dann gibt es auch Dinge, die sich sowohl mit PHP als auch mit JavaScript realisieren lassen: beispielsweise die Formularprüfung, also die Überprüfung, ob die im Formular eingegebenen Daten sinnvoll sind.

    In dem Fall würde ich Ihnen raten, beides zu machen: die Daten also mit JavaScript und mit PHP zu überprüfen. Die Überprüfung über JavaScript hat den Vorteil, dass sie dem Nutzer unmittelbares Feedback gibt. So können Sie - um auf das Ebay-Beispiel zurückzukommen - bei der Prüfung per Javascript den Inhalt des Telefonfeldes prüfen, bevor der Nutzer das Formular abgesendet hat. Die Überprüfung über PHP bietet hingegen den Vorteil, dass sie sich nicht abschalten lässt.

  • Das kann nur PHP

    Die eigentliche Formularverarbeitung, also beispielsweise die Daten per Mail zu versenden oder in eine Datenbank einzutragen, können Sie nur mit einer serverseitigen Skriptsprache wie beispielsweise PHP machen.

  • Zusammenspiel von JavaScript und PHP bei AJAX:

    Dann gibt es natürlich die raffinierte Zusammenarbeit von JavaScript und PHP bei der neuen Technik AJAX. Ein Beispiel: Wenn Sie bei amazon.de etwas in das Suchfeld eingeben, werden Ihnen Vorschläge unterbreitet für mögliche Suchbegriffe.

    Bei amazon erhält man direkt Vorschläge zum eingegebenen Suchbegriff

    Hier wird per JavaScript die Eingabe der einzelnen Buchstaben abgefangen und im Hintergrund diese Informationen an den Server übertragen. Auf dem Server wird in einer Datenbank nachgeschaut, was für mögliche Suchbegriffe es gibt, und das Ergebnis zurückgeliefert. Das Ergebnis wird per JavaScript abgefangen und dann die Vorschlagsliste entsprechend erweitert. Für AJAX braucht man JavaScript und eine serverseitige Sprache - also beispielsweise PHP.

Mitglied werden, Vorteile nutzen!

  • Sie können alles lesen und herunterladen: Beiträge, PDF-Dateien und Zusatzdateien (Checklisten, Vorlagen, Musterbriefe, Excel-Rechner u.v.a.m.)
  • Unsere Autoren beantworten Ihre Fragen

Inhalt

Downloads zu diesem Beitrag

Weitere Downloads

Über die Autorin:

bild117864

Dr. Florence Maurice bietet Dienstleistungen im Webpublishing in Form von Fachtexten und Trainings (auch maßgeschneiderte Inhouse-Schulungen). Außerdem programmiert sie Webseiten. Ihre Themen: HTML, ...

Newsletter abonnieren