JavaScript Grundkurs

Auf und zu

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Sie lernen in diesem Video die window-Methoden open() und close() zum Öffnen und Schließen von Browserfenstern (auch in Zusammenhang mit Frames) kennen. Auch hier gibt es Einschränkungen in modernen Browsern.
06:39

Transkript

Historisch war die Methode Open sicherlich eine der wichtigsten vom Windowobjekt. Sie sehen hier eine ganz einfache Anwendung. Wie der Name deutlich macht geht es um das Öffnen von einem Browserfenster und Sie müssen nicht mehr tun als window.Open oder einfach Open zu schreiben und als ersten Parameter in dem URL von dem Bild und der Webseite der Text von der Ressource allgemein zu notieren. Im prinzip gibt es drei mögliche Parameter, die Sie angeben können; den URL, einen Fensternamen, was der bedeutet besprechen wir gleich und eine dritten Parameter mit Optionen. Beachten Sie, dass ich hier eine Stringverkettung mache und das wirklich nur ein Parameter ist, der bis hierhin geht. Ich nehme an, Sie kennen alle diese Popups, die über die letzten Jahre die meisten Anwender genervt haben. Sie gehen auf eine Webseite und plötzlich poppen alle möglichen Fenster auf. Die meisten dieser Popups wurden mit der Openmethode realisiert und genau das ist das große Problem. Diese Methode wurde einfach missbraucht und Sie kennen auch die Folge, pop up blocker. Was nichts anderes bedeutet, als im Prinzip die Anwendung dieser Methode entweder komplett verhindert wird, oder zumindestens eingeschränkt wird. Von daher ist diese Methode wie ich eingangs sagte, historisch eine der wichtigsten. Mittlerweile versucht man neue Informationen in die Seite mit anderen Techniken zu bekommen. Das Stichwort ist hauptsächlich Ajax. Trotzdem gibt es immer noch durchaus Fälle, wo man mit so einem Öffnen eines Fensters arbeiten wird und man sollte auch nicht vergessen, dass es ja irgendwann mal so etwas wie Frames gab. Frames gibt es immernoch in Form von Inline-Frames, aber es gab sie ja auch in Form dieser Framesest und dort hatten die Framesets Fensternamen. Und mit der Openmethode kann man gezielt in einen dieser Framesets einen neuen Inhalt laden, den dafür ist dieser zweite Parameter gedacht. Wenn Sie hier den Namen eines Frames in einem Frameset angeben, wird der Inhalt genau dort geöffnet. Nun arbeitet man, wie gesagt mit normalen Frames kaum noch und dieser Fenstername hat noch eine andere Bedeutung, den Sie sehen, dass ich hier einmal einen Fensternamen doppelt verwendet. Das bedeutet, wenn Sie die Openmethode aufrufen und es gibt bereits eine andere Fensterinstanz, die mit diesem Namen geöffnet wurde, dann wird der neue Inhalt, den dort bereits angezeigten Inhalt ersetzen. Gibt es diesen Namen noch nicht, oder ist noch keine Instanz offen, dann wird eine neue Fensterinstanz geöffnet. Man darf diesen Fensternamen, aber nicht verwechseln mit dem Rückgabewert, den die Openmethode liefert. Sie sehen, dass ich hier eine Variable global initialisiere mit Null und hier in dieser Funktion den Rückgabewert der Methode Open verwerte und hier auch. Das ist es letztendlich ein Zeiger, ein Pointer auf das Fenster und wenn ich diesen Pointer dann nehme, habe ich eine Referenz auf ein Fensterobjekt und auf diesen kann ich beispielsweise auch die Methode Close wieder aufrufen, um dieses Fenster zum Beispiel über einen Klick auf einen Button aus einer Website herauszuschließen, sofern mir das der Browser gestartet , denn um gewissen Umständen wird der Browser schlißen von Fenstern ebenfalls unterbinden. Des Weiteren ist noch zu beachten, dass es heute in fast allen modernen Browsern üblich ist, dass Sie solche Tabulatoren haben, also die Tabs bedeuten Fenster innerhalb einer Browserinstanz. Und wenn Sie die Openmethode so benutzen, wird in solchen Browsern einfach ein neues Tab aufgemacht. Geben Sie hingegen Optionen an, wird ein neues Fenster geöffnet. Diese Optionen sind ganz ofensichtlich optional und auch ich denke gut zu erkennen, was sie bedeuten; Breite, Höhe, ob es in der Größe veränderbar ist, ob es Verzeichnisschaltflächen gibt, was nur in einigen Browsern funktioniert, ob es eine Menüleiste gibt, ob es eine Adresszeile gibt. Es gibt noch weitere Optionen, die teilweise browserabhängig sind, aber hier sind die wichtigsten zu sehen. Schauen wir uns das Beispiel jetzt in der Praxis an. Ich habe diese Funktion hier mit Schaltflächen verbunden, wo Sie entsprechend aufgerufen werden. Das ist diese Webseite mit den Schaltflächen. Wenn ich eine Webseite öffnen möchte, ohne Option, verwende ich die Openmethode mit nur einem Parameter und Sie sehen es geht einfach ein neues Tab auf, zumindest bei den Pausen die mit Tabs arbeiten können, alte Internet Explorer können das ja noch nicht. Wenn ich mit Optionen arbeite, dann geht wirklich in allen Browsern auch ein neues Fenster auf, sofern das eben nicht verboten ist. Genauso können Sie ja auch einfach eine Grafik laden und wenn Sie hier drauf klicken, dann ist die neue Resouce in den bereits offenen Fenster geladen worden. Das sieht man etwas besser, wenn man den App aufrufenden Browser kleiner macht. Einmal, so einmal können Sie erkennen, dass es wirklich das gleiche Fenster ist und hiermit können Sie dieses Fenster schließen. Beachten Sie noch mal, dass das Schließen nicht überall erlaubt ist. Sie können theoretisch sogar solche Dinge machen, wie self.close mit dem reservierten Token für das aktuelle Fenster. Aber das werden die meisten Browser vehindern. Als Fazit von diesem Film möchte ich festhalten, dass die Methoden Open und Closed durchaus noch ihre Bedeutung haben, aber sie gewisse Einschränkungen einkalkulieren müssen, aufgrund der Browsereinstellung. Und so als kleines Bonbon zum Abschluss, will ich Ihnen etwas zeigen, was man nie tun sollte, aber was im Prinzip möglich ist. Sie können while(true) open Machen. Probieren Sie es besser nicht aus. In einer Endlosschleife werden permanent Browserfenster geöffnet, beziehungsweise Tabs, den Sie müssen kein URL angeben und das ist wie gesagt eine Endlosschleife. Das kann zu massiven Problemen führen, in älteren Systemen sogar Ihren Rechner zum einfrieren bringen. Also ganz schnell wieder weg damit.

JavaScript Grundkurs

Lernen Sie die Möglichkeiten der universellen Sprache JavaScript kennen und machen Sie sich mit der Syntax vertraut, um Ihre Web-Applikationen durch effektive Skripts zu ergänzen.

8 Std. 20 min (134 Videos)
Derzeit sind keine Feedbacks vorhanden...

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!