4.1 Browserobjekte

Wie Sie bereits wissen, funktioniert die JavaScript-Sprache innerhalb des Browsers und muss daher irgendwie mit demselben Browser interagieren. Zu diesem Zweck verfügt der Browser über mehrere Objekte und Funktionen, die in JavaScript verfügbar sind.

Das erste ist an object window, das das Browserfenster beschreibt. Oder besser gesagt, ich habe früher beschrieben, als Browser keine Tabs hatten. Nun beschreibt das Fensterobjekt den aktuellen Browser-Tab, in dem die Seite mit dem Skript geladen wird.

Zweitens ist dieser an object documentfür das im Tab angezeigte Dokument verantwortlich. Das könnte etwas verwirrend sein. Nehmen wir der Einfachheit halber an, dass es sich bei dem Dokument um das handelt, was dem Benutzer angezeigt wird, und bei dem Fenster, in dem dieses Dokument angezeigt wird.

Java webinar

Drittens ist dieser an object consolefür die Ausgabe an die Browserkonsole verantwortlich. Ja, Browser verfügen auch über eine Konsole, diese dient hauptsächlich dem Debuggen des Skripts und der Anzeige von Fehlermeldungen. Normalerweise können Sie es öffnen, indem Sie die F12-Taste in Ihrem Browser drücken.

Object windowist das Objekt der obersten Ebene für alle Seitenobjekte. Und obwohl Sie Objektnamen direkt documentin consoleIhr Skript schreiben können, sind deren Namen window.documentund window.console.

4.2 Dialoge in JavaScript

Alert()-Methode

Es an object windowverfügt außerdem über mehrere Funktionen, die für das Seitenskript sichtbar sind. Am häufigsten wird das verwendet alert(). Es ermöglicht Ihnen, ein Dialogfeld mit einer Nachricht an den Benutzer anzuzeigen. Das Skript wird dann angehalten, bis der Benutzer auf „OK“ klickt.

Beispiel:

alert("JavaScript is the best!");

prompt()-Methode

Es gibt auch eine Funktion, mit der Sie den Benutzer auffordern können, einen Wert einzugeben – diese ist prompt().

Beispiel:

var age = prompt("Enter Year of Birth");

bestätigen()-Methode

Sie können ein Dialogfeld mit zwei Schaltflächen anzeigen Ok– Cancelfragen Sie den Benutzer nach einer Aktion.

Beispiel:

var isOK = confirm("Are you ready");

4.3 onload()-Ereignis

Und noch ein nützlicher und interessanter Moment. Das Browserfenster verfügt über ein Ereignis , das ausgelöst wird, wenn das Dokument vollständig geladen ist. Sie können Code angeben, der ausgeführt werden soll, nachdem das Dokument geladen und angezeigt wurde.

Dies kann auf drei Arten erfolgen.

Erstens können Sie JavaScript-Code als Attributwert direkt in eine HTML-Seite einbetten:

<body onload="alert('document loaded');">
  <img src="big-image.png">
</body>

Zweitens können Sie JavaScript-Code einfach in eine HTML-Seite einbetten:

<head>
    <script>
        function load()
        {
            alert('document loaded');
        }
        window.onload = load;
    </script>
</head>
<body>
    <img src="big-image.png">
</body>

Drittens können wir es etwas kürzer schreiben, indem wir eine anonyme Funktion deklarieren:

<head>
    <script>
        window.onload = function () {
            alert('document loaded');
        }
    </script>
</head>
<body>
    <img src="big-image.png">
</body>

4.4 onclick()-Ereignis

Und schließlich ist noch ein weiteres wichtiges Ereignis (Ereignis) event OnClick. Dies geschieht bei jedem Element, auf das der Benutzer geklickt hat. Da event OnLoades auf verschiedene Arten eingestellt werden kann, geben wir hier nur die einfachste an:

<body>
  <img src="big-image.png" onclick="alert('user clicked on the image');">
</body>