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 ein Objekt 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 ein Objekt 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.

Drittens ist dieser ein Objekt 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.

Объект 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 ein Objektа 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("Geburtsjahr eingeben");

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="alarm('Dokument geladen');">
  <img src="big-image.png">
</body>

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

<head>
    <script>
        function load()
        {
            alert('Dokument geladen');
        }
        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('Dokument geladen');
        }
    </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('Benutzer hat auf das Bild geklickt');">
</body>

Java webinar