JavaScript lernen - schnell und praktisch

Von: Dr. Florence Maurice
Stand: 25. Januar 2010
4
(1)
Beitrag bewerten
Anmelden um Kommentare zu schreiben

Praxis-Tipps zum Einsatz von JavaScrip

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.

Dies ist eine Leseprobe

Möchten Sie den Beitrag komplett lesen? Dann werden Sie Probemitglied und testen Sie akademie.de 14 Tage kostenlos!

Auf JavaScript lernen erfahren Sie mehr über diesen Beitrag und die weiteren Leseproben.

Weitere Informationen finden Sie auf unserer Infoseite zur Mitgliedschaft und in unseren AGB.

Ich bin bereits Mitglied
Jetzt Probemitglied werden
Ich kann in den 14 Tagen Probezeit formlos z.B. per E-Mail stornieren. Wenn ich das nicht tue, entscheide ich mich für ein