JavaScript - Objektreferenz - window
1. Das Objekt
Das window
-Objekt steht in der Hierarchie des DOM an oberster Stelle. Daneben gibt es keine weiteren. Damit steuern
wir ein Fenster als Ganzes. Dieses Objekt verfügt über Eigenschaften und Methoden.
2. Eigenschaften
innerHeight
, innerWidth
(Internet Explorer ab Version 9)
Hiermit kann die innere Höhe und Breite eines Fensters abgefragt werden, also alles im eigentlichen Fenster ohne Menüleiste, Favoriten, Statuszeile, und so weiter.
breite = window.innerWidth;
alert (breite);
outerHeight
, outerWidth
(Internet Explorer ab Version 9)
Hiermit kann die Gesamthöhe und -breite eines Fensters abgefragt werden.
hoehe = window.outerHeight;
alert (hoehe);
pageYOffset
, pageXOffset
(Internet Explorer ab Version 9)
Fragt die aktuelle horizontale bzw. vertikale Position innerhalb einer Seite ab. Diese Eigenschaft kann wunderbar mit der
Methode scrollTo
kombiniert werden.
left_posi = window.pageXOffset;
name
Speichert und ändert den Namen eines Fensters. Ist besonders sinnvoll im Zusammenhang mit der Methode open
.
3. Methoden
alert
Gibt eine Fehlermeldung aus. Eignet sich hervorragend, um nach Fehlern zu suchen oder auf fehlerhafte Benutzereingaben des Users zu reagieren.
breite = window.innerWidth;
if (breite < 740)
{
alert ('Bitte die Fensterbreite vergrößern');
}
open
Öffnet ein neues Fenster. Im Gegensatz zur HTML-Attribut target="_blank"
hat man deutlich mehr Einflussmöglichkeiten. Diese
Methode erwartet mindestens zwei Parameter, optional drei. Der erste ist der Name der Datei, der zweite der Name des Fensters
und im dritten definieren wir das Aussehen, also Größe, Darstellung, Scrollleisten und so weiter.
Der dritte Parameter
height
,width
(px) Breite und Höhe des Fenstersleft
,top
(px) Position des Fensters in Pixelnresizable
(yes|no) verhindert bzw. erlaubt, dass die Fenstergröße verändert werden kannscrollbars
(yes|no) mit oder ohne Scrolleiste
window.open ('bla.htm', 'Blabla', 'width=300, height=400, scrollbars=no');
moveBy
, moveTo
Verschiebt das Fenster um den angegebenen Wert. Der Unterschied liegt darin, dass man bei moveBy
sagt, um wie viele Pixel
es verschoben wird, während man mit moveTo
sagt, wohin man es platzieren möchte. Erwartet werden zwei Werte, für die X-
und Y-Position, moveBy
gestattet auch negative Zahlen.
blubber = window.open ('blubb.htm', 'blubb', 'width=300, height=400');
blubber.moveBy (50,50);
blubber.moveTo (100,200);
prompt
Öffnet ein Dialogfenster mit einem Textfeld, das über einen Ok- und Abbrechen-Button verfügt.
eingabe = prompt ('Tipp was ein!', '');
print
Öffnet den "Drucken"-Dialog. Entspricht der Vorgehensweise "Datei" -> "Drucken". Es gibt keine Parameter.
resizeBy
resizeTo
Verändert die Größe eines Fensters um den angegebenen Wert. Auch gilt derselbe Unterschied wie in obigem Beispiel. resizeBy
verändert die Größe relative zum Ursprungswert, resizeTo
dagegen absolut. Erwartet werden zwei Werte, für die X- und
Y-Position. resizeBy
gestattet auch negative Zahlen.
window.resizeBy (-50,50);
window.resizeTo (250,400);
scrollBy
, scrollTo
Scrollt zu einem bestimmten Punkt. Bei scrollBy
die Anzahl von Pixeln, bei scrollTo
zu einer Position. Erwartet
werden zwei Werte, für die X- und Y-Position. scrollBy
gestattet auch negative Zahlen.
window.scrollBy (-20, -10);
window.scrollTo (100, 100);
setTimeout
, clearTimeout
setTimeout
führt eine Anweisung mit einer bestimmten Verzögerung aus. Es werden zwei Parameter erwartet, erstens die
Anweisung oder Funktion und zweitens die Verzögerung in Millisekunden. Mit clearTimeout
kann man das vorzeitig beenden.
Als Parameter benötigt man die Referenz von setTimeout
. Allerdings muss man bei diesen Methoden nicht das Hauptobjekt
window
angeben. Zu diesem Thema gibt es auch ein kleines Tutorial.
function tuWas ()
{
}
bla = setTimeout ("tuWas()", 5000);
clearTimeout (bla);
setInterval
, clearInterval
Funktioniert fast wie setTimeout
/clearTimeout
. Der einzige Unterschied besteht darin, dass setInterval
immer wieder nach einer bestimmten Zeitspanne aufgerufen wird. Und die gibt man im zweiten Parameter an.
function tuWas ()
{
}
bla = setInterval ("tuWas()", 1000);
clearInterval (bla);
4. Eine Besonderheit
opener
Damit könnt ihr von neu geöffneten Fenstern auf alle Eigenschaften und Methoden des Ursprungsfensters zugreifen. Um was es sich hier handelt,
ist ein wenig umstritten. Manche nennen es eine Eigenschaft, manche bezeichnen es als Objekt und dann gibt es noch ein paar Leute
die darin eine Art von Instanz des window
-Objektes sehen.
window.opener.close ();
window.opener.location.href= 'bla.htm';
window.opener.style.color = '#f00';
Ein Hinweis
Normalerweise arbeitet man bei window.open
mit Referenzvariablen. Und wenn man das tut, so sollte man sie auch bei opener
damit bearbeiten. Denn sonst bezieht sich der Code auf das gerade aktuell geöffnete Fenster.
var blubber = window.open (...);
blubber.opener.close();
zurück zum vorherigen Abschnitt weiter zum nächsten Abschnitt