Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Javascript
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Eigenschaften
• Entwicklung von Netscape
• kein direkter Bestandteil von HTML, sondern eine eigene Programmiersprache
• Plattformunabhängige Skriptsprache
• Objektorientiert
• Java ähnliche Syntax (hat jedoch mit Java nichts zu tun!)
• JavaScript lässt sich im Browser ein-/ausschalten_IEBrowser ein-/ausschalten_Firefox
• Steuert HTML und CSS
• Unterschiedliche Implementierungen FireFox/Mozilla und Microsoft, die jedoch untereinander weitgehend kompatibel sind. (Explorer JScript)
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Warum Javascript?
• JavaScript erweitert die beschränkten Möglichkeiten von HTML
• Clientseitige Programmiersprache (Alles läuft im Browser ab!)
• HTML5 = HTML + JavaScript + CSS
• AJAX (Asynchronous JavaScript And XML) Web 2.0-Technologie
• Interaktive PDF-Dateien mit JavaScript
• Interaktive 3D-Animationen im PDF mit JavasScript
• SVG (Scalable Vector Graphics) programmierbar mit JavaScript
• Flash-Programmiersprache Actionscript 2.0 ähnlich wie JS
• Zukünftig kann Flash auch mit JavaScript programmiert werden
• Photoshop und InDesign können mit JavaScript gesteuert werden
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Client-Seitige Ausführung
• JavaScript läuft in einer so genannten "Sandbox". Das ist eine Art Sicherheitskäfig, in dem die Programmiersprache eingesperrt ist.
• Sie wird dabei um typische Möglichkeiten anderer Programmiersprachen beschnitten, vor allem um die Möglichkeit, beliebig Daten aus Dateien lesen und in Dateien schreiben zu können.
• So soll verhindert werden, dass JavaScript-Programmierer auf den Rechnern von Anwendern, die eine JavaScript-unterstützte Web-Seite aufrufen, Unfug treiben können.
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Aufgaben JavaScript
• Steuern von Aussehen und Inhalt der Dokumente
• Steuern des Browsers
• Interaktion mit HTML-Formularen
• Interaktion mit dem Benutzer
• Lesen und Schreiben des Client-Zustandes mit Cookies
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Aufgaben JavaScript
• Steuern von Aussehen und Inhalt der Dokumente
• Methode write()
• DocumentObjectModel (DOM)
• Veränderung der CSS-Attribute aller Elemente
• Steuern des Browsers- das Window-Objekt - Dateneingabe vom Benutzer
Meldungen anzeigenEingaben einholenNachrichten in der Statuszeile
- das History-Objekt, die schon besuchten Seiten Navigation Vor- und Zurück des Browsers
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Aufgaben JavaScript
Interaktion mit HTML-Formularen
• Einlesen der Eingabe-Elemente
• Formulare validieren
• Berechnungen durchführen (günstigere clientseitige Berechnung!)
• Ausgabe
Interaktion mit dem Benutzer
• Definition von Event-Handler (Ereignisorientierte Programmierung)
• z.B. Mouse-Over, Schaltflächen drücken
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Aufgaben Javascript
Lesen und Schreiben des Client-Zustandes mit Cookies
• Cookie = eine kleine Menge von Zustandsdaten, die permanent oder temporär im Client-Rechner gespeichert werden
• sie können mittels JavaScript geschrieben und gelesen werden
Zusammenarbeit mit eingebetteten Objekten
• Videos, x3d, webGL, glTF, SVG, PDF
Browser-Eigenschaften lesen
• Browser-Version
Hardware-Eigenschaften lesen
• Screen-Objekt liefert Informationen über Größe und Farbtiefe des Monitors
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Was JavaScript nicht kann
• Keine andere Grafikfähigkeit außer HTML-Elemente zu erzeugen
• Aus Sicherheitsgründen – kein Zugriff auf das Dateisystem
• Keine Netzwerk-Funktionalität
- Downloaden- Über Serverseitige-Skripte Uploaden- E-Mail schicken
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Javascript und Suchmaschinen
JavaScript am Ende der HTML-Seite einbauen.
Die ersten Zeilen eines Dokumentes werden oft als Seitenbeschreibung verwendet oder werden besonders, bei Vorkommen eines Schlüsselwortes, bewertet.
Falls die Ausführung des JavaScripts nicht behindert wird, ist der Code besser am Ende des Dokumentes einzusetzen.
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
JavaScript in HTML definieren
<script>…</script>
• in Head oder Body
• keine feste Vorschrift
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Möglichkeit 1 Javascript in HTML einzubinden
1. Im Kopf(<head>) oder Körper(<body>) der HTML-Datei.
<html><head><title>Beispiel für Javascript</title><script>
alert("Hallo Welt!");</script></head><body></body>
</html>
U01_Alert_Fenster.htmlU01_Prompt_Eingabefenster.htmlhttps://technischeredaktion.com/webtech/HTML_CSS_JS_Folien/Folienbsp12_JS_Einfuehrung/u01\U01_Alert_Fenster.htmlhttps://technischeredaktion.com/webtech/HTML_CSS_JS_Folien/Folienbsp12_JS_Einfuehrung/u01\U01_Prompt_Eingabefenster.html
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Möglichkeit 2 JavaScript in HTML einzubinden
2. Bei einem Ereignis innerhalb der HTML-Seite.
<html><head><title>Eigenschaften</title></head><body bgcolor="#FFFF00">
<a href="#" onclick="document.bgColor='red'"> Hintergrundfarbe ändern!</a>
</body></html>
U02_JS_in_HTMLbereich.htmlU02_bgcolor_Image.htmlhttps://technischeredaktion.com/webtech/HTML_CSS_JS_Folien/Folienbsp12_JS_Einfuehrung/u02/U02_JS_in_HTMLbereich.htmlhttps://technischeredaktion.com/webtech/HTML_CSS_JS_Folien/Folienbsp12_JS_Einfuehrung/u02/u02/U02_bgcolor_Image.html
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Möglichkeit 2 JavaScript in HTML einzubinden
<!doctype html><html><head><meta charset="utf-8"><title>Unbenanntes Dokument</title></head><style>body {
background-color: #F3DC0D;}
</style><body><a href="#" onClick="document.body.style.backgroundColor = 'green'"> 1 Farbe aendern!</a><br />
<a href="#" onClick="document.body.style.backgroundColor = '#FF0000'"> 2 Farbe aendern!</a><br/>
<a href="#" onClick="document.getElementsByTagName('body')[0].style.backgroundColor = '#0000FF'"> 3 Farbe aendern!</a>
</body></html>
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Möglichkeit 3 JavaScript in HTML einzubinden
3. Als externe Datei.
<html><head><title>JavaScript-Test</title>
<script src="separat.js"></script>
</head><body><form>
<input type=button value="Quadrat von 6 errechnen" onClick="Quadrat(6)"></form></body></html>
Externe Datei: separat.js
function Quadrat(Zahl){Ergebnis = Zahl * Zahl;alert("Das Quadrat von " + Zahl + " = " + Ergebnis);}
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Möglichkeiten JavaScript in HTML einzubinden
4. In einem Link mit javascript:.
<html><head>
<title>Javascript im Link</title></head><body>
<a href="javascript:alert('Hello world!!!')">Alert-Fenster öffnen!</a>
</body></html>
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Lexikalische Struktur
Die Menge der elementaren Regeln, die Angeben, wie man Programme in dieser Sprache schreibt.
- aussehen der Variablennamen (a, test, test1, 2test_x, …)
- Objekte (document, frames, window, math, …)
- Methoden (z.B. window.open(…) neues Fenster öffnen)
- Eigenschaften (z.B. window.innerHeight) Innere Höhe des Fensters
Uebung4.htmlhttps://technischeredaktion.com/webtech/HTML_CSS_JS_Folien/Folienbsp12_JS_Einfuehrung/u04/Uebung4.html
Uebung „Planetengetriebe Vorteile“
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Lexikalische Struktur
Zeichensatz
• Unicode• Unterstützt fast alle geschriebenen Sprachen der Erde
Groß-und Kleinschreibung
• Case sensitive = unterscheidet zwischen Groß-und Kleinschreibung• ! HTML ist nicht case sensitive !
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Lexikalische Struktur
Leerzeichen
• zwischen den Befehlen werden ignoriert• in einer Zeichenkette werden berücksichtigt
Anweisungen
• Anweisungen werden in einer Zeile geschrieben und mit einem Semikolon (;) auseinander gehalten
a = 3; a = 3; b=4;b = 4;
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Lexikalische Struktur
Kommentare
• einzeilige Kommentare• mehrzeilige Kommentare
// einzeiliger Kommentar
/*mehrzeilige Kommentarewerden in dieser Form geschrieben
*/
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Anweisungen
JavaScript besteht aus einer kontrollierten Anordnung von Anweisungen
Das sind Befehle, die der JavaScript-Interpreter des WWW-Browsersbewertet und in Maschinencode umsetzt, der auf dem Rechner des Anwenders ausführbar ist.
z.B.
zahl = 42;quadrat = zahl * zahl;
if(zahl > 1000) zahl = 0;alert("Das Quadrat von " + zahl + " = "+ quadrat);
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Variablen definieren
• Variablen sind Speicherbereiche• Zwischenspeicherung von Daten• "Wert" = der Inhalt einer Variablen• Inhalt ist jederzeit änderbar• vor der Benutzung müssen Variablen zuerst definiert werden
z.B.
var Nummer = 42;var i, x;var satzteil = "Das Quadrat von ";
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Zahlen
• JavaScript unterscheidet nicht zwischen Integer- und Gleitkommawerte
• Alle Zahlen werden als Gleitkommawerte dargestellt
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Strings
• Folge von Unicode-Buchstaben, -Ziffern, -Interpunktionszeichen…
• zwischen einfachen oder doppelten Anführungszeichen ( ' oder " )
• einfache und doppelte Anführungszeichen können ineinander verschachtelt werden
var myString = 'Test';var myFormular = 'name="mein_Formular"';
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Steuerzeichen bei Zeichenketten
<script type="text/javascript">
var variable1 = "Hier erfolgt ein\nZeilenumbruch"; //(alert-Fenster)var variable2 = "Menge\t23"; //(alert-Fenster)var variable3 = "Dann sagte er:\"Obstsalat! \"";var variable4 = 'Glaub\'s mir';var variable5 = '\u03c0 = 3,14...';
</script>
• Steuerzeichen dieser Art werden durch das Zeichen \ eingeleitet. Dahinter folgt ein Buchstabe, der das Steuerzeichen markiert.
Uebung41.htmlhttps://technischeredaktion.com/webtech/HTML_CSS_JS_Folien/Folienbsp12_JS_Einfuehrung/u04/Uebung41.html
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Steuerzeichen
\t Tabulator
\n Zeilenumbruch
\" Doppeltes Anführungszeichen
\' Einfaches Anführungszeichen
\\ Backslash
\uXXXX Unicode-Zeichen
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Strings zusammensetzen
Addition
var name1="Internet";
var name2="Anwendungen";
var fach = "Name des Faches: " + name1 + "-" + name2;
Uebung42.htmlhttps://technischeredaktion.com/webtech/HTML_CSS_JS_Folien/Folienbsp12_JS_Einfuehrung/u04/Uebung42.html
Variable
Variable Zeichenkette Variable Zeichen Variable
Operator Operator OperatorVariable
Zeichenkette
Zeichenkette
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Strings - Zeichenketten
Länge des Strings
var name1 = "internet";var L = name1.length; //Eigenschaft• liefert 8 zurück
• das letzte Zeichenvar letztesZeichen = name1.charAt(name1.length-1); // Methode• liefert t zurück
• Substringvar teilstring = name1.substring(1,4); // Methode• Liefert nte zurück
• Position eines Buchstaben ermitteln
var low = name1.toLowerCase(); // internetvar up = name1.toUpperCase(); // INTERNET
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Strings - Zeichenketten
Einen String in einem String finden
Die indexOf() Methode liefert die erste Position (als Nummer) der ersten gefundenen Zeichenkette innerhalbeiner Zeichenkette:
var str = "Das blaue Haus in der Hauptstraße.";var n = str.indexOf("blaue");alert(n);
Ausgegeben wird 4.
var str = "Das blaue Haus in der Hauptstraße.";if (str.indexOf("blaue") != -1) {document.write("blaue ist ein Teilstring von str");
}
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Boolesche Werte
• nur zwei zulässige Werte: true oder false
• sind oft das Ergebnis eines Vergleichs. Ist 3 größer als 4?
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Operatoren
Zuweisungsoperator weist einer Variable einen Wert zu
var Anton = 42;
• Vergleichsoperatoren
<script>
var Anton = 42;if (Anton == 42) alert(1); if (Anton != 42) alert(0); if (Anton > 42) alert(0); if (Anton < 42) alert(0); if (Anton >= 18) alert("SIE duerfen das hier sehen!"); if (Anton <= 17) alert("SIE duerfen das hier NICHT sehen!");
</script>
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Operatoren
Zuweisungsoperator weist einer Variable einen Wert zu
Uebung43.html
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Funktionen
• erweitern den Sprachraum der Sprache
• wird ein Mal definiert und kann in einem Programm beliebig oft ausgeführt werden
z.B. PrimzahlCheck(Zahl) {…}
• Schlüsselwort function + Leerzeichen + frei wählbarer Funktionsname + Funktions-Argumente (bei Bedarf in Klammer, Kommagetrennt)
• Funktionsrumpf steht zwischen 2 geschweiften Klammern
• in sich abgeschlossene Einheit
- Input = Parameter- Output = Rückgabe
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Funktionen - Alternativer Funktionsaufruf! 1/2
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Funktionsaufruf</title><link href="g2.css" rel="stylesheet" type="text/css" /></head><body><p><img src="motor.jpg" width="240" height="210" /></p></body><script src="g2.js"></script></html>
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Funktionen - Alternativer Funktionsaufruf! 2/2
// JavaScript Document
var b = 150;var h = 100;
document.images[0].onclick = function() {b = b + 150;h = h + 100;var Breite = b + "px";var Hoehe = h + "px";document.images[0].style.width = Breite;document.images[0].style.height = Hoehe;
}
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Funktionen
• einfache Funktion
Math.sin((Math.PI/180)*30);
• Definition einer eigenen Funktion
function quadrat(x) {return x*x;}
• Funktionsaufruf
var wert1 = Math.sin((Math.PI/180)30);var wert2 = quadrat(30);
Uebung5.htmlhttps://technischeredaktion.com/webtech/HTML_CSS_JS_Folien/Folienbsp12_JS_Einfuehrung/u05/Uebung5.html
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Bedingte Anweisungen
• Wenn-Dann-Bedingungen mit "if"
if( Eingabe != Passwort ) {alert( "Falsches Passwort!" );Geheim();
} else {document.location.href="geheim.htm";
}
• Vergleichsoperatoren von Variablen
A == B Trifft zu, wenn A=3 und B=3.A != B Trifft zu, wenn A=1 und B=3.A < B Trifft zu, wenn A=1 und B=3.A > B Trifft zu, wenn A=3 und B=2.A <= B Trifft zu, wenn A=3 und B=3 und A=2 und A=1… A >= B Trifft zu, wenn A=3 und B=3 und A=4 und A=5 ...
Uebung6.htmlhttps://technischeredaktion.com/webtech/HTML_CSS_JS_Folien/Folienbsp12_JS_Einfuehrung/u06/Uebung6.html
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Logische Operatoren
• Logisches UND &&• Alle Bedingungen müssen erfüllt sein, damit die gesamte Bedingung erfüllt ist
if((x > 2) && (x < 10))
Uebung7.htmlhttps://technischeredaktion.com/webtech/HTML_CSS_JS_Folien/ Folienbsp12_JS_Einfuehrung/ u07/if_else_und_oder.html
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Logische Operatoren
• Logisches ODER ||• Eine der Bedingungen muss erfüllt sein, damit die gesamte Bedingung erfüllt ist
if( (x > 2) || (x < 10) )
• Logisches NICHT !
if( !(x > 2) )
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Bedingte Anweisungen
Fallunterscheidung mit "switch"
switch (monat_zahl) {
case 1: var monat_wort = " Januar "; break;case 2: var monat_wort = " Februar "; break;case 3: var monat_wort = " März "; break;case 4: var monat_wort = " April "; break;case 5: var monat_wort = " Mai "; break;case 6: var monat_wort = " Juni "; break;case 7: var monat_wort = " Juli "; break;case 8: var monat_wort = " August "; break;case 9: var monat_wort = " September "; break;case 10: var monat_wort = " Oktober"; break;case 11: var monat_wort = " November "; break;case 12: var monat_wort = " Dezember"; break; default: var monat_wort = "Unbekannter Monat";
}
Beispielhttps://technischeredaktion.com/webtech/HTML_CSS_JS_Folien/Folienbsp40/Folienbsp40_switch_JS.html
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Schleifen mit while
• Wertet zuerst den Ausdruck aus• Bei true wird die Schleife ausgeführt.• Sie wird so lange ausgeführt, bis der Ausdruck als false ausgewertet wird
var zaehler = 0;
while( zaehler < 10 ) {document.write("<p>" + zaehler + "<\/p>");zaehler++;
}
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Schleifen mit do/while
• Auswertung des Ausdrucks geschieht immer am Ende der Schleife• Die Schleife wird mindestens ein Mal ausgeführt
var x = 10;
do {document.write("<p>x*x = "+(x*x)+"<\/p>");x = x + 1;
} while(x < 10);
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Schleifen mit for
• Iteration über eine Menge• Ausführung der Schleife• Kompaktere Schreibweise als while
var Ausgabe = "";
for(var zaehler=0;zaehler<10;zaehler++) {document.write("<p>"+ zaehler +"</p>");
}
// Anstatt zaehler = zaehler + 1 kann auch zaehler++ geschrieben werden.// Anstatt zaehler = zaehler + 3 kann auch zaehler+=3 geschrieben werden.
Siehe auch JavaScript Assignment Operators bei w3Schools
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Kontrolle in Schleifen - break
• Beendet sofort eine Schleife
var i = 0;
while (i < 6) {if (i == 3) break;i++;
}
alert("i = " + i);
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Kontrolle in Schleifen - continue
var i = 0, j = 0;
while (i < 6) {i++;if (i == 3) continue;j++;
}alert("i ist gleich " + i + " und j ist gleich " + j);
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Gültigkeitsbereich von Variablen
• Der Gültigkeitsbereich einer Variable ist der Bereich eines Programms, in dem sie definiert ist.
• Globale Variablen haben einen globalen Gültigkeitsbereich.
• Lokale Variablen sind nur innerhalb einer Funktion oder eines Anweisungs-Blocks gültig.
<script>a = 'xyz'; // globale Variable
function machWas() {b = 'xyz'; // globale Variablevar a = 'abc'; // lokale Variable
}
machWas(); // a ist 'xyz' und b ist 'xyz' </script>
Hochschule Karlsruhe Technik & Wirtschaft Internet-Technologien T3B250 Prof. Dipl.-Ing. Martin Schober
Objekte im HTML-Teil identifizieren
Die Methode getElementById() greift entsprechend der HTML-Variante des DOM (Document Object Model) auf ein HTML-Element zu, das ein id-Attribut besitzt.
Wert aus einem Textfeld mit der id Eingabefeld1: document.getElementById("Eingabefeld1").value
Die Methode getElementsByName() (HTML-Elementzugriff über name-Attribut) greift entsprechend der HTML-Variante des DOM auf ein HTML-Element zu, das ein name-Attribut besitzt. Sie liefert eine nummerierte Liste als Rückgabewert, über die der Zugriff auf die gefundenen Elemente ermöglicht wird.
Wert aus einem Textfeld mit dem name Eingabefeld: document.getElementsByName("Eingabefeld")[0].value