4.1 Obiekty przeglądarki

Jak już wiesz, język JavaScript działa wewnątrz przeglądarki, więc musi jakoś współdziałać z tą samą przeglądarką. W tym celu przeglądarka ma kilka obiektów i funkcji, które są dostępne w JavaScript.

Pierwszy to an object window, który opisuje okno przeglądarki. A raczej opisywałem, kiedy przeglądarki były bez kart. Teraz obiekt okna opisuje aktualną kartę przeglądarki, w której załadowana jest strona ze skryptem.

Po drugie, to an object documentten, który odpowiada za dokument wyświetlany w zakładce. To może być trochę mylące. Dla uproszczenia powiedzmy, że dokument jest wyświetlany użytkownikowi, a okno jest tym, w którym ten dokument jest wyświetlany.

Po trzecie, jest to an object consoleten, który odpowiada za wyjście do konsoli przeglądarki. Tak, przeglądarki też mają konsolę, służy ona głównie do debugowania skryptu i wyświetlania komunikatów o błędach. Zwykle można go otworzyć, naciskając przycisk F12 w przeglądarce.

Object window, jest obiektem najwyższego poziomu dla wszystkich obiektów strony. I chociaż możesz bezpośrednio zapisywać nazwy obiektów documentw consoleswoim skrypcie, w rzeczywistości ich nazwy window.documenti pliki window.console.

4.2 Okna dialogowe w JavaScript

metoda alert().

Posiada również an object windowkilka funkcji, które są widoczne dla skryptu strony. Najczęściej używanym jest tzw alert(). Pozwala wyświetlić okno dialogowe z komunikatem dla użytkownika. Skrypt jest następnie zawieszany, dopóki użytkownik nie kliknie OK.

Przykład:

alert("JavaScript is the best!");

metoda zachęty().

Jest też funkcja, za pomocą której można poprosić użytkownika o wprowadzenie jakiejś wartości – jest to prompt().

Przykład:

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

metoda potwierdzenia().

Możesz wyświetlić okno dialogowe z dwoma przyciskami Ok- Cancelzapytaj użytkownika o jakąś akcję.

Przykład:

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

4.3 zdarzenie onload().

I jeszcze jeden przydatny i interesujący moment. Okno przeglądarki ma zdarzenie , które uruchamia się, gdy dokument jest w pełni załadowany. Możesz określić kod do wykonania po załadowaniu i wyświetleniu dokumentu.

Można to zrobić na trzy sposoby.

Po pierwsze, możesz osadzić kod JavaScript bezpośrednio na stronie HTML jako wartość atrybutu:

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

Po drugie, możesz po prostu osadzić kod JavaScript na stronie HTML:

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

Po trzecie, możemy napisać to nieco krócej, deklarując anonimową funkcję:

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

4.4 zdarzenie onclick().

I na koniec jeszcze jedno ważne wydarzenie (wydarzenie) to event OnClick. Występuje na każdym elemencie, który kliknął użytkownik. Tak jak event OnLoadmożna to ustawić na różne sposoby, tak my podamy tylko ten najprostszy:

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