JavaScript: Unterschied zwischen den Versionen

Version vom 2. Januar 2023, 15:48 Uhr

Einführung

Vieles aus folgendem Buch übernommen:

Schlagwort	Info
Titel	Das Einsteigerseminar JavaScript
Author	Michael Seeboerger-Weichselbaum
Verlag	bhv
ISBN	3-8266-7200-3
Webseite zum Buch	http://www.seebi.de/

Auf Grund der Trennung von Javascript zur Verhaltenssteuerung der Webseite und der Darstellung durch HTML sollte man die häufig eingesetzten direkten Aufrufe im HTML mit <button onclick()> vermeiden und dies über einen Eventhandler direkt im eingebunden Skript erledigen.

Programmcode Beispiel


 <html>
  <head>
   <title>Testpage</title>
   <script type = "text/javascript">
     //Javascript Code mit Definitionen
       function () {
       } // end function ()
   </script>
  </head>
  !**  Ab hier kann man den Code verwenden **
  <body onload = "function ()">
     !**  Die folgenden Funktionen sind inline JS-Eventhandler **
     <a href = "http://www.java.com" 
        onMouseOver = "window.status = 'Javaseite'; return true" 
        onMouseOut = "window.status = ' '; return = true">
        <img src = "bild.gif">
     </a>
  </body>
 </html>

Möchte man das Script in eine Datei auslagern, so muss nur das script Tag erweitert werden:
<script type = "text/javascript" src="datei.js"> Ab HTML5 ist auch die Angabe von type nicht mehr notwendig. language hingegen ist "deprecated" und soll daher nicht mehr eingesetzt werden.

Sprachelemete

Kommentare

// -> Einzeilig
/* */ -> Mehrzeilig

Schlüsselwörter

Bedingungen

if (Vergleich) {} // Abfrage
else {} // Wenn nicht if, dann...
switch (x) case 1: // Verzweigt an Hand der Bedingungsvariable.
break; // Abbruch, wenn Bedingung erfüllt. Sonst geht die Prüfung weiter. So kann man auch auf Bereiche prüfen
default: // Wenn keine erfüllt, kann auch default eingebaut werden.

Schleifen

while (Bedingung) {} // Solange die Bedingung stimmt, wird ausgeführt
for (Start;Ende;Schritt) // Solange die Endbedingung nicht erreicht ist, wird die Zählvariable um die Schrittweite angepasst
break; // Schleife verlassen
continue; // Schleife mit dem nächsten Durchgang fortsetzen

Definitionen

function () // Funktion definieren
var x = ... // Variable definieren

sonstige reservierte Wörter

do // do-while Schleife
false und true
in // in for Schleife verwendet
new // neues Objekt
return // Rückgabewert
this // aktuelles Objekt

Für die Zukunft reservierte Wörte

noch nicht verwendete, doch reservierte Wörter (Evtl. in neueren Versionen schon verwendet):

abstract, boolean, byte, Catch, char, class, const, Default, delete, debugger, enum, Double
export, extends, final, Finally, float, goto, implements, Import, instanceof, int, interface, Label
long, native, null, Package, private, protected, public, Short, static, super, synchronized, Throw
throws, transient, try, Typeof, void, with\

Vergleichsoperatoren

AND und OR sind nicht erlaubt.

< <= und > => Für grösser und kleiner Vergleiche
== != gleich und ungleich
&& || UND und ODER

Eventhandler

Eventhandler werden in html-tags integriert und reagieren auf Ereignisse. Die Schreibweise ist egal.

onBlur // Element (z.B. Eingabefeld) verliert den Focus
onClick // Beim Klicken mit der linken Maustaste
onFocus // Element bekommt den Focus
onLoad // Beim Laden des Elementes
onMouseOut // Beim verlassen des Bereiches durch die Maus
onMouseOver // Wenn sich die Maus im "TAG"-Bereich befindet

Gesamthaft gibt es zur Zeit fast 30 Eventhandler (JS 1.5).

Objektbaum

Folgende Objekte stehen zur Verfügung:


 window    -> document -> Image               // Bilder bearbeiten
                       -> Form   -> elements  // Formular "manipulieren"
                       -> Link                // 
                       -> Anchor
           -> Location                        // aktuelle Webadresse
           -> History                         // besuchte Seiten
 navigator -> Plugin                          // Browser und verwendete Plugins
 screen                                       // Bildschirmauflösung
 Math                                         // Mathematische Funktionen
 Date                                         // Datum und Uhrzeit
 String                                       // Strings manipulieren

window

Stellt das Browserfenster dar. Wichtigstes Unterelement ist document, welches die Webseite enthält.

Methoden:

win = window.open("", "Titel", width = "x", height = "y", resizable = "yes"); // Webseite öffnen. Ohne resiz. hat das Fenster eine fixe Grösse.
window.alert("Alarmmeldung"); // Meldungen mit Ok.
var = window.confirm("Bestätigung"); // Ok und Abbruch. var ist TRUE bei Ok.
var = window.prompt("Frage"); // Ok und Abbruch. var enthält den Text der Abfragebox.
window.close() // Schliesst das Fenster
win.setTimeout("window.close", 5000); // Timeout von 5000 Milisekunden abwarten, dann die Funktion (Fenster schliessen) ausführen.

Eigenschaften

window.status("Ausgabe"); // Statusleiste\

document

Will man ein DOM-Element manipulieren, so geschieht dies über dieses Unterobjekt. Die direkte Ausgabe auf die Seite ist eher selten. Meist wird dann das gewünschte Element über seine ID angesprochen oder man benennt das Objekt wie etwa ein Formular (<form>) oder einen Abschnitt (<p>) direkt.

Methoden:

window.document.bgColor = "#007F7F"; // Hintergrundfarbe setzen
window.document.fgColor = "#FFFF00"; // Vordergrundfarbe setzen
window.document.open("text/html"); // Das Fenster als html definieren
window.document.write("<h1>Dies ist ein Test</h1>"); // Text an das aufgerufene Objekt übergeben

form (Formular auswerten)

Das Formular ist "eine Hülle", welche die relevanten Elemente umfasst. Man kann es entweder direkt über den DOM mit seiner Position, mit der erstellten ID oder über den vergebenen Name ansprechen. Es ist zu beachten, dass hierbei weder der Name noch die ID doppelt vorkommen darf.


 function check() {
   var laenge, eingabe;
   eingabe = window.document.Formular.Feld1.value;
   laenge = eingabe.length;
   // Test des Inhalts und was auch immer
 } // end function check

 <form name = "Formular">
   <input name = "Feld1">
   <input type = "Button" value = "Absenden" onclick = "return check()">
 </form>

Der return hier ist wichtig. Liefert die Funktion TRUE zurück (Standard), so wird das Formular abgeschickt. Liefert sie FALSE, so muss nochmals geprüft werden. Im Fehlerfall muss die Prüffunktion daher FALSE zurückliefern.

Da die Elemente in der Reihenfolge ihres Auftretens angesprochen werden, hätte man dieses Formular auch über

 window.document.forms[0]

ansprechen können.

Wichtige Methoden:

..formularname.submit() // Sendet das Formular ab
..formularname.reset() // Setzt das Formular zurück

Wichtige Eigenschaften:

..formularname.action // Enthält den Inhalt von action im Form-Tag\
..formularname.length // Enthält die Anzahl Elemente des Formulars\

select (Auswahlliste in Formular auswerten)

Die Auswahlliste ist eigentlich nur ein Teil eines Forms. Da sie aber häufig auftritt und die saubere Verarbeitung nicht einfach ist, folgt hier ein Beispiel mit Auswertung einer Liste, welche dann die entsprechende Datei zum Download zur Verfügung stellt.


 function auswahl() {
   var index = window.document.Formular.SelectFeld.selectedIndex; // Holt den Index des select
   var datei = window.document.Formular.SelectFeld.options[index].value; // Holt den Namen aus dem Index heraus
   location.href=datei; // Die Datei zum download anbieten -> Bei html oder text würde auf die neue Seite gewechselt
 } // end function auswahl

 <form name = "Formular">
   <select name = "SelectFeld">
     <option selected = "selected" value = 'file1.zip'>File 1</option>
     <option value = 'file2.zip'>File 2</option>
   </select>
   <input type = "Button" value = "Download" onClick = "auswahl()">
 </form>

elements (Formular auswerten)

Wie unter Form erklärt, kann man die Elemente mit ihrem Namen oder ihrer ID ansprechen. Verwendet man den DOM, so spricht man die Elemente über ihre Arrynummer an

 window.document.forms[0].elements[0]

Die einzelnen Elemente kann man über die Eigenschaft length von Form durchzählen. Auch hier darf bei Verwendung des Namens oder der ID kein Feld doppelt vergeben sein.

Wichtige Methoden:

..formularname.elementname.focus() // Setzt den Fokus auf das betreffende Feld
..formularname.elementname.select() // Markiert das betreffende Feld

Wichtige Eigenschaften:

..formularname.elementname.value // Liest den Inhalt des Feldes aus. Dieser kann darüber auch gesetzt werden.
..formularname.elementname.type // Enthält den Typ des entsprechenden Feldes (Input, Submit, usw.)

images (Bilder)

Die Bilder werden entweder über ihren Namen oder über den Index in der Reihenfolge angesprochen: window.document.images[0].src = "bild1.jpeg"; // src ist die source.

Wichtige Eigenschaften:

..images[0].border // Nur lesbar. Prüft, ob die Grafik einen Rand hat
..images[0].heigth // Nur lesbar. Höhe der Grafik
..images[0].width // Nur lesbar. Breite der Grafik

Location

Ort der Webseite. Kann etwa für Umleitungen verwendet werden. Auch Dateidownloads sind möglich.

Eigenschaften:

location.href = "neu.html" // Neue Seite im Browser öffnen
location.href = "neu.zip" // Datei wird zum Download angeboten

History

Webseitenverlauf

Methoden:

history.back() // Eine Seite zurück
history.forward() // Eine Seite vor
history.go(Nummer) // Geht zur gewünschten Position. -1 = 1 Seite zurück und 1 = 1 Seite vor.
Man kann auch einen Teil der gewünschten URL übergeben und der Browser versucht dann, zu dieser Seite zu gehen.

navigator und screen

Möglichst nicht verwenden, da Browserweichen out sind und Bildschirmauflösungen für eine fliessende Darstellung unrelevant sind. Daher die Eigenschaften mehr aus historischen Gründen. Wenn man unterschiedliche Bildschirme ansprechen möchte, so wird dies über @media im CSS-Teil der Webseite geregelt. Unter selfhtml wird gezeigt, wie HTML, CSS und JS ineinandergreifen.

navigator:

var = navigator.appName; // Browsername wie IE5, Opera10 usw. Kann über den UserAgent-Switcher angepasst werden
var = navigator.appCodeName; // Codenamen des Browsers
var = navigator.appVersion; // Browserversion
var = navigator.language; // Sprache des Browsers
var = navigator.platform; // Betriebssystem
var = navigator.userAgent; // Zeile, welche der eingestellte UserAgent liefert.

Das Unterobjekt plugins könnte zum Prüfen auf ein gewünschtes Plugin verwendet werden, doch dies will man ja nicht fördern.

screen:

var = screen.height // Bildschirmhöhe
var = screen.width // Bildschirmbreite
var = screen.pixelDepth // Pixeltiefe in Bit (8, 16, 24, 32)
var = screen.colorDepth // Farbtiefe -> Wenn gleich wie Pixeltiefe, dann falsch (2 hoch Pixeltiefe) -> Math.pow(2, screen.PixelDepth)
var = screen.availHeight // verfügbare Bildschirmhöhe
var = screen.availWidth // verfügbare Bildschirmbreite

Will man die Bildschirmbreite an php übergeben, damit etwa die Vorschaubilder abhängig der Bildschirmbreite ausgegeben werden, so ist dies möglich:


  echo("<script language='javascript'>\n");
  echo("location.href=\"${_SERVER['SCRIPT_NAME']}?${_SERVER['QUERY_STRING']}"."&width=\" + screen.width + \"&height=\" + screen.height;\n");
  echo ("</script>\n");
  exit();

Anschliessend stehen die Werte als GET-Parameter zur Auswertung in PHP zur Verfügung.

Math, Date und String

Wichtige Methoden und Eigenschaften der Objekte.

Math:

y = Math.E // Eulersche Zahl = 2.718...
y = Math.floor(Zahl) // Rundung auf nächsttiefere Zahl
y = Math.PI; // Wert von pi = 3.14...
y = Math.pow(Zahl, Potenz) // Potenzierung der gewünschten Zahl -> 2, 32 -> 2hoch32 sind etwa 16Millionen
y = Math.round(Zahl) // Rundung auf nächsthöhere Zahl (oder mathematisch?)
y = Math.sin(Winkel); // Sinus des Winkels. Entsprechend cos, tan
y = Math.sqrt(Zahl); // Quadratwurzel

String (1. Buchstabe beginnt an Position 0.):

y = x.charAT(Stelle); // Liefert das Zeichen, welches an der gesuchten Stelle steht. Meist für Vergleiche (if (x.charAT(0) == 3))... -> Siehe Standardfunktionen
y = eval(String1 Rechenoperation String2) // Es wird mathematisch gerechnet, ohne dass die Strings vorher umgewandelt hätten werden müssen. Vorsicht bei Divisionen, damit es kein Div by Zero gibt.
y = x.indexOF("Vergleichsstring") // Wird der Vergleichsstring im String gefunden, ist die Antwort grösser als -1
y = x.parseFloat(String); // Versucht, den String in eine Gleitkommazahl umzuwandeln.
y = x.parseInt(String); // Versucht, den String in eine ganze Zahl umzuwandeln.
y = x.slice(Start); // Schneidet von Start bis zum Ende heraus.
y = x.String(Objekt); // Wandelt das Objekt in einen String. Funktioniert es nicht, gibt es einen leeren String.
y = x.substr(Anfang, Länge); // Ab Anfang ausschneiden, bis Länge erreicht.
y = x.substring(Anfang, Ende); // Es werden die Buchstaben der Position Anfang bis Ende ausgeschnitten.
y = x.toUpperCase(String); // Alles in Grossbuchstaben. In Kleinbuchstaben vice versa.

Date: Zuerst muss ein Objekt erstellt werden, welches dann die konkreten Daten enthält: var Datum = Date();

jahr = Datum.getFullYear();
monat = Datum.getMonth() + 1;
tag = Datum.getDate();

Die Zeit wird über getHours(), getMinutes() und getSeconds ermittelt. Möchte man von UTC ausgehen, so erhalten die Funktionen einfach noch ein UTC vorne: getUTCFullYear()

Funktionen

Werden direkt über die Eventhandler aufgerufen:

 <code>
  <head>
    <script language = "javascript">
     function test() {
       // Hier kommt nun die Funktion
     } // end function test
   </script>
 </head>

 <body onload = "test()">
 </body>

Wichtig ist, dass Funktionen mit Buchstaben beginnen müssen und sonst nur noch Zahlen und den Unterstrich enthalten dürfen. Es sind keine Sonderzeichen oder reservierten Wörter erlaubt. Gross- und Kleinschreibung wird beachtet.

Parameterübergabe

Die Parameter werden einfach in der Klammer mitgegeben und in der Funktion direkt ausgewertet ohne Variablendefinition.

function test(parameter) {...} // end function test()

test(parameter);

Standardfunktionen

zahl = parsFloat(Text); // Versucht, den Text in eine Float Zahl umzuwandeln. Enthält sie Text, ergibt es 0.
charAt(Zeichen); // Wandelt die Variable Z in einen Char um.
if (erlaubteZeichen.indexOf(TestZeichen) == -1); // Wenn die Variable nicht im String erlaubteZeichen auftaucht, wird -1 zurückgeliefert. Der String kann alle möglichen Zeichen enthalten auf die man prüfen will.
x.setTimeout('function()', 1000) // Das Objekt x ruft nach 1000 Milisekunden die gewünschte Funktion auf. x kann zum Beispiel window sein. Wenn man nun <body onLoad="window.setTimeout('umleiten()', 5000)"> einsetzt, wird die Funktion nach 5 Sek. aufgerufen.

Nützliche Funktionen

Eingabe auf erlaubte Zeichen prüfen


function check_Eingabe () {
 var zeichen = "0123456789", zähler, eingabe, länge; // Erlaubte Zeichen definieren und Hilfsvariablen zur Auswertung. 
                                                    // Der Funktion könnte das Feld natürlich auch direkt übergeben werden.
 Eingabe = window.document.forms[0].elements[0].value; // Element, welches ausgewertet wird
 länge = Eingabe.length;
 for (zähler = 0; zähler=länge; zähler++) {
  if (zeichen.indexOf(Eingabe.charAt(zähler))==-1) { // Vergleichen, ob das Zeichen an der Stringstelle von Eingabe nicht 
                                                    // im String zeichen vorkommt
   alert ("Nur Ziffern sind erlaubt");
   window.document.forms[0].elements[0].value=""; // Wert zurücksetzen -> Kann man auch unterlassen
   window.document.forms[0].elements[0].focus(); // Focus aufs Feld mit dem Fehler
   return false; // Wenn man den Test beim absenden macht, verhindert das false das absenden. True ist Standard, wenn alles i.O.
  } // end if
 } // end for
} // end function eingabe()

Wichtige allgemeine Eigenschaften

Folgende Eigenschaften werden von mehreren Objekten zur Verfügung gestellt und verwendet:

length

Enthält die Länge einer Variable oder die Anzahl Elemente eines Arrays. a = window.document.length; // Anzahl Zeichen einer Webseite

value

Wert, welcher in ein Objekt geschrieben wird. document.Formularname.Feldname.value = String;

Fehlerbehandlung (try-catch-finally)

try {
  // Anweisungsblock, welcher Fehler machen könnte
}
catch(error) {
  // Ausführung, wenn der Fehler auftrat
}
finally {
  // Immer ausführen, egal ob Fehler oder nicht
}

Die Anweisung im try kann beliebig sein (Stream öffnen, testen der Benutzereingabe usw.). Tritt ein Fehler auf, welcher einen Programmfehler mit Abbruch generieren würde, so wird er an den catch-Block weiter geleitet. Dort kann man dann eine Ausgabe machen, was schief lief. Über finally kann man dann wieder bei Bedarf einen neuen Versuch anbieten oder über eine Variable entsprechend handeln.

@@ Zeile 1: / Zeile 1: @@
-= Einführung =
+== Einführung ==
 Vieles aus folgendem Buch übernommen:
 {| class="wikitable"
@@ Zeile 18: / Zeile 18: @@
 Auf Grund der Trennung von Javascript zur Verhaltenssteuerung der Webseite und der Darstellung durch HTML sollte man die häufig eingesetzten direkten Aufrufe im HTML mit <code><nowiki><button onclick()></nowiki></code> vermeiden und dies über einen Eventhandler direkt im eingebunden Skript erledigen.
-= Programmcode Beispiel =
+== Programmcode Beispiel ==
   <code>
    <html>
@@ Zeile 44: / Zeile 44: @@
 Ab HTML5 ist auch die Angabe von <code>type</code> nicht mehr notwendig. <code>language</code> hingegen ist "deprecated" und soll daher nicht mehr eingesetzt werden.
-= Sprachelemete =
+== Sprachelemete ==
-== Kommentare ==
+=== Kommentare ===
 * //    -> Einzeilig
 * /* */ -> Mehrzeilig
-== Schlüsselwörter ==
+=== Schlüsselwörter ===
-=== Bedingungen ===
+==== Bedingungen ====
 * if (Vergleich) {}        // Abfrage
 * else {}                  // Wenn nicht if, dann...
@@ Zeile 58: / Zeile 58: @@
               default:      // Wenn keine erfüllt, kann auch default eingebaut werden.</nowiki>
-=== Schleifen ===
+==== Schleifen ====
 * while (Bedingung) {}     // Solange die Bedingung stimmt, wird ausgeführt
 * for (Start;Ende;Schritt) // Solange die Endbedingung nicht erreicht ist, wird die Zählvariable um die Schrittweite angepasst
@@ Zeile 64: / Zeile 64: @@
 * continue;                // Schleife mit dem nächsten Durchgang fortsetzen
-=== Definitionen ===
+==== Definitionen ====
 * function ()              // Funktion definieren
 * var x = ...              // Variable definieren
-=== sonstige reservierte Wörter ===
+==== sonstige reservierte Wörter ====
 * do // do-while Schleife
 * false und true
@@ Zeile 76: / Zeile 76: @@
 * this // aktuelles Objekt
-=== Für die Zukunft reservierte Wörte ===
+==== Für die Zukunft reservierte Wörte ====
 noch nicht verwendete, doch reservierte Wörter (Evtl. in neueren Versionen schon verwendet):
 * abstract, boolean, byte, Catch, char, class, const, Default, delete, debugger, enum, Double
@@ Zeile 83: / Zeile 83: @@
 * throws, transient, try, Typeof, void, with\
-== Vergleichsoperatoren ==
+=== Vergleichsoperatoren ===
 AND und OR sind nicht erlaubt.
 * < <= und > => Für grösser und kleiner Vergleiche
@@ Zeile 89: / Zeile 89: @@
 * && || UND und ODER
-== Eventhandler ==
+=== Eventhandler ===
 Eventhandler werden in html-tags integriert und reagieren auf Ereignisse. Die Schreibweise ist egal.
 * onBlur      // Element (z.B. Eingabefeld) verliert den Focus
@@ Zeile 100: / Zeile 100: @@
 Gesamthaft gibt es zur Zeit fast 30 Eventhandler (JS 1.5).
-= Objektbaum =
+== Objektbaum ==
 Folgende Objekte stehen zur Verfügung:
   <code>
@@ Zeile 115: / Zeile 115: @@
    '''String'''                                       // Strings manipulieren
   </code>
-== window ==
+=== window ===
 Stellt das Browserfenster dar. Wichtigstes Unterelement ist document, welches die Webseite enthält.
@@ Zeile 126: / Zeile 126: @@
 * win.setTimeout("window.close", 5000); // Timeout von 5000 Milisekunden abwarten, dann die Funktion (Fenster schliessen) ausführen.
-=== Eigenschaften ===
+==== Eigenschaften ====
 * window.status("Ausgabe"); // Statusleiste\
-== document ==
+=== document ===
 Will man ein DOM-Element manipulieren, so geschieht dies über dieses Unterobjekt. Die direkte Ausgabe auf die Seite ist eher selten.
 Meist wird dann das gewünschte Element über seine ID angesprochen oder man benennt das Objekt wie etwa ein Formular (<form>) oder einen Abschnitt <nowiki>(<p>)</nowiki> direkt.
@@ Zeile 139: / Zeile 139: @@
 * window.document.write("<nowiki><h1>Dies ist ein Test</h1></nowiki>");  // Text an das aufgerufene Objekt übergeben
-== form (Formular auswerten) ==
+=== form (Formular auswerten) ===
 Das Formular ist "eine Hülle", welche die relevanten Elemente umfasst. Man kann es entweder direkt über den DOM mit seiner Position, mit der erstellten ID oder über den vergebenen Name ansprechen. Es ist zu beachten, dass hierbei weder der Name noch die ID doppelt vorkommen darf.
   <code>
@@ Zeile 168: / Zeile 168: @@
 * ..formularname.length // Enthält die Anzahl Elemente des Formulars\
-== select (Auswahlliste in Formular auswerten) ==
+=== select (Auswahlliste in Formular auswerten) ===
 Die Auswahlliste ist eigentlich nur ein Teil eines Forms. Da sie aber häufig auftritt und die saubere Verarbeitung nicht einfach ist, folgt hier ein Beispiel mit Auswertung einer Liste, welche dann die entsprechende Datei zum Download zur Verfügung stellt.
   <code>
@@ Zeile 186: / Zeile 186: @@
   </code>
-== elements (Formular auswerten) ==
+=== elements (Formular auswerten) ===
 Wie unter Form erklärt, kann man die Elemente mit ihrem Namen oder ihrer ID ansprechen. Verwendet man den DOM, so spricht man die Elemente über ihre Arrynummer an
    window.document.forms[0].elements[0]
@@ Zeile 199: / Zeile 199: @@
 * ..formularname.elementname.type  // Enthält den Typ des entsprechenden Feldes (Input, Submit, usw.)
-== images (Bilder) ==
+=== images (Bilder) ===
 Die Bilder werden entweder über ihren Namen oder über den Index in der Reihenfolge angesprochen:
 window.document.images[0].src = "bild1.jpeg"; // src ist die source.
@@ Zeile 209: / Zeile 209: @@
-== Location ==
+=== Location ===
 Ort der Webseite. Kann etwa für Umleitungen verwendet werden. Auch Dateidownloads sind möglich.
@@ Zeile 216: / Zeile 216: @@
 * location.href = "neu.zip"  // Datei wird zum Download angeboten
-== History ==
+=== History ===
 Webseitenverlauf
@@ Zeile 224: / Zeile 224: @@
 * history.go(Nummer) // Geht zur gewünschten Position. -1 = 1 Seite zurück und 1 = 1 Seite vor.<br />Man kann auch einen Teil der gewünschten URL übergeben und der Browser versucht dann, zu dieser Seite zu gehen.
-== navigator und screen ==
+=== navigator und screen ===
 Möglichst nicht verwenden, da Browserweichen out sind und Bildschirmauflösungen für eine fliessende Darstellung unrelevant sind. Daher die Eigenschaften mehr aus historischen Gründen.
 Wenn man unterschiedliche Bildschirme ansprechen möchte, so wird dies über @media im [[CSS|CSS]]-Teil der Webseite geregelt.
@@ Zeile 256: / Zeile 256: @@
 Anschliessend stehen die Werte als GET-Parameter zur Auswertung in [[PHP|PHP]] zur Verfügung.
-== Math, Date und String ==
+=== Math, Date und String ===
 Wichtige Methoden und Eigenschaften der Objekte.
@@ Zeile 289: / Zeile 289: @@
 Möchte man von UTC ausgehen, so erhalten die Funktionen einfach noch ein UTC vorne: getUTCFullYear()
-= Funktionen =
+== Funktionen ==
 Werden direkt über die Eventhandler aufgerufen:
@@ Zeile 309: / Zeile 309: @@
 Gross- und Kleinschreibung wird beachtet.
-=== Parameterübergabe ===
+==== Parameterübergabe ====
 Die Parameter werden einfach in der Klammer mitgegeben und in der Funktion direkt ausgewertet ohne Variablendefinition.
@@ Zeile 318: / Zeile 318: @@
 </code>
-=== Standardfunktionen ===
+==== Standardfunktionen ====
 *zahl = '''parsFloat'''(Text); // Versucht, den Text in eine Float Zahl umzuwandeln. Enthält sie Text, ergibt es 0.
 *'''charAt'''(Zeichen);        // Wandelt die Variable Z in einen Char um.
@@ Zeile 324: / Zeile 324: @@
 *x.'''setTimeout'''('function()', 1000) // Das Objekt x ruft nach 1000 Milisekunden die gewünschte Funktion auf. x kann zum Beispiel window sein. Wenn man nun <body onLoad="window.setTimeout('umleiten()', 5000)"> einsetzt, wird die Funktion nach 5 Sek. aufgerufen.
-=== Nützliche Funktionen ===
+==== Nützliche Funktionen ====
-==== Eingabe auf erlaubte Zeichen prüfen ====
+===== Eingabe auf erlaubte Zeichen prüfen =====
   <code>
@@ Zeile 345: / Zeile 345: @@
   </code>
-= Wichtige allgemeine Eigenschaften =
+== Wichtige allgemeine Eigenschaften ==
 Folgende Eigenschaften werden von mehreren Objekten zur Verfügung gestellt und verwendet:
-== length ==
+=== length ===
 Enthält die Länge einer Variable oder die Anzahl Elemente eines Arrays.
 a = window.document.length; // Anzahl Zeichen einer Webseite
-== value ==
+=== value ===
 Wert, welcher in ein Objekt geschrieben wird.
 document.Formularname.Feldname.value = String;
-= Fehlerbehandlung (try-catch-finally) =
+== Fehlerbehandlung (try-catch-finally) ==
 <pre>
 try {
@@ Zeile 370: / Zeile 370: @@
 Die Anweisung im try kann beliebig sein (Stream öffnen, testen der Benutzereingabe usw.). Tritt ein Fehler auf, welcher einen Programmfehler mit Abbruch generieren würde, so wird er an den catch-Block weiter geleitet. Dort kann man dann eine Ausgabe machen, was schief lief. Über finally kann man dann wieder bei Bedarf einen neuen Versuch anbieten oder über eine Variable entsprechend handeln.
-= Webseiten mit freien Javascripts =
+== Webseiten mit freien Javascripts ==
 * [http://www.javapool.de/ Javapool]
 * [http://www.bodo.com/JavaScripts/index.html Bodo]

JavaScript: Unterschied zwischen den Versionen

Version vom 2. Januar 2023, 15:48 Uhr

Inhaltsverzeichnis

Einführung

Programmcode Beispiel

Sprachelemete

Kommentare

Schlüsselwörter

Bedingungen

Schleifen

Definitionen

sonstige reservierte Wörter

Für die Zukunft reservierte Wörte

Vergleichsoperatoren

Eventhandler

Objektbaum

window

Eigenschaften

document

form (Formular auswerten)

select (Auswahlliste in Formular auswerten)

elements (Formular auswerten)

images (Bilder)

Location

History

navigator und screen

Math, Date und String

Funktionen

Parameterübergabe

Standardfunktionen

Nützliche Funktionen

Eingabe auf erlaubte Zeichen prüfen

Wichtige allgemeine Eigenschaften

length

value

Fehlerbehandlung (try-catch-finally)

Webseiten mit freien Javascripts

Navigationsmenü

JavaScript: Unterschied zwischen den Versionen

Version vom 2. Januar 2023, 15:48 Uhr

Einführung

Programmcode Beispiel

Sprachelemete

Kommentare

Schlüsselwörter

Bedingungen

Schleifen

Definitionen

sonstige reservierte Wörter

Für die Zukunft reservierte Wörte

Vergleichsoperatoren

Eventhandler

Objektbaum

window

Eigenschaften

document

form (Formular auswerten)

select (Auswahlliste in Formular auswerten)

elements (Formular auswerten)

images (Bilder)

Location

History

navigator und screen

Math, Date und String

Funktionen

Parameterübergabe

Standardfunktionen

Nützliche Funktionen

Eingabe auf erlaubte Zeichen prüfen

Wichtige allgemeine Eigenschaften

length

value

Fehlerbehandlung (try-catch-finally)

Webseiten mit freien Javascripts

Navigationsmenü

Suche