Rozdział 19.

Tworzenie skryptów w języku JavaScript

W kilku poprzednich rozdziałach poznałeś sposoby wzbogacania tworzonych stron WWW o dodatkowe metody interakcji, takie jak mapy graficzne, formularze oraz skrypty CGI. Wszystkie te narzędzia, z wyjątkiem map graficznych, są dostępne w najnowszych prze­glądarkach, dzięki czemu będziesz mógł ich spokojnie używać, bez zbytniego przejmowa­nia się o zachowanie kompatybilności. Jednakże stosowanie ich ma także swoją cenę: wy­maga­ją one bowiem kontaktu z serwerem WWW, na przykład, do przetworzenia skryptu, i jako takie nie są najlepszym rozwiązaniem przy tworzeniu wielu typów prezen­tacji.

W tym oraz w kilku następnych rozdziałach poznasz nowe narzędzia wzbogacające możli­wości samej przeglądarki i pozwalające na tworzenie interesujących interaktywnych prezen­tacji, które nie bazują na programach CGI wykonywanych na serwerze. Pierwsze z tych na­rzę­dzi zostanie przedstawione w tym rozdziale; są to skrypty pisane w języku JavaScript.

Język JavaScript, wcześniej nazywany także LiveScirpt, jest językiem programowania słu­żącym do dodawania nowych możliwości funkcjonalnych do dokumentów HTML. Skrypty napisane w tym języku umieszczane są bezpośrednio w dokumentach HTML i wykonywane przez przeglądarkę. JavaScript jest nowością wprowadzoną przez firmę Netscape; zyskała ona już aprobatę i poparcie wielu innych organizacji oraz firm. W różny sposób, język ten dostęp­ny jest aktualnie w kilku różnych przeglądarkach, między innymi, w Netscape Navi­gatorze oraz Microsoft Internet Explorerze.

Podobnie jak znaczna większość technologii używanych na Internecie, a w szczególności na WWW, także i język JavaScript jest cały czas modernizowany i rozszerzany. Prze­szedł on błyskawicznie od wersji 1.0, dostępnej w Netscape Navigatorze 2, poprzez wersję 1.1 w Nawigatorze 3 i wersję 1.2 w Navigatorze 4, aż do wersji 1.3 w Navigatorze 4.5. W tym sa­mym czasie firma Microsoft stworzyła swoją własną wersję języka JScript, która dostępna jest w Microsoft Internet Explorerze 3 i 4. Wszystkie wersje różnią się od siebie drobny­mi szczegółami. W rozdziale tym nie będziemy zajmowali się różnicami między po­szczególny­mi implementacjami i wersjami języka; zamiast tego skupimy się na jego podsta­wowych cechach, wspólnych dla wszystkich implementacji.

	Język JavaScript, stworzony przez firmę Netscape, jest językiem skryptowym i nie ma wiele wspólnego z językiem Java opracowanym przez firmę Sun Micro­systems. Jednakże ze względu na podobieństwo nazwy, oba te języki są często ze sobą mylone. JavaScript jest prostym językiem, a programy napisane w nim mogą być wykonywane tylko i wyłącznie w przeglądarkach WWW. Java jest językiem programowania o nieporównywalnie większych możliwościach, który może być wykorzystywany praktycznie wszędzie.

W tym rozdziale poznasz podstawowe zagadnienia dotyczące języka JavaScript, takie jak:

• czym jest JavaScript,

• dlaczego miałbyś używać tego języka,

• znacznik <SCRIPT>,

• podstawowe polecenia oraz konstrukcje języka,

• przykłady prostych programów napisanych w języku JavaScript.

Przedstawienie języka JavaScript

Zgodnie z oświadczeniem prasowym, opublikowanym wspólnie przez firmę Netscape Communications oraz Sun Microsystems, JavaScript jest „łatwym do użycia obiektowym języ­kiem skryptowym, zaprojektowanym do tworzenia aplikacji łączących obiekty i zasoby zarów­no w przeglądarce użytkownika, jak i na serwerze WWW. JavaScript stworzony zos­tał z myślą o autorach stron WWW oraz twórcach aplikacji firmowych, w celu umożliwie­nia im dynami­cznego opisu zachowania obiektów uruchamianych w przeglądarkach oraz na serwerach WWW”.

Mówiąc najprościej jak można, powyższy opis oznacza, że za pomocą języka JavaScript możesz dodać do tworzonych stron WWW nowe możliwości funkcjonalne, które w prze­szłości wymagały zastosowania skomplikowanych programów CGI uruchamianych na ser­we­rze. Pod wieloma względami JavaScript przypomina język Visual Basic, przyjazny dla użyt­kownika język programowania opracowany przez firmę Microsoft. Nawet, jeśli nie po­siadasz żadnego doświadczenia programistyczne­go, będziesz mógł wykorzystywać JavaScript do two­rzenia skomplikowanych aplikacji działających na stronach WWW.

Czynnikiem, który powoduje, że JavaScript to wyjątkowy język, jest sposób, w jaki został zintegrowany ze stronami WWW. Programy w nim pisane nie są prze­chowywane w odrębnych plikach, tak jak programy CGI, lecz zapisywane bezpośrednio wewnątrz stron WWW, podobnie jak znaczniki i obiekty HTML. Innymi słowy, programy JavaScript osadzane są wewnątrz dokumentów HTML. Ponadto, w odróżnieniu od pro­gra­mów CGI, które są wykonywane przez serwer WWW, programy napisane w języku JavaScript wykonywane są bezpośrednio przez samą przeglądarkę. Dzięki temu są one łatwe do przenoszenia i mogą być wykonywane przez wszystkie przeglądarki, które są w stanie obsługiwać progra­my napisane w tym języku, niezależnie od typu komputera oraz systemu operacyjnego.

	Firma Netscape stworzyła także wersję języka JavaScript, która umożliwia tworzenie programów wykonywanych na serwerze WWW, jako zastąpienie lub rozszerzenie uprzednich możliwości programów CGI. Język JavaScript, umożliwiający tworzenie tego typu programów zaimplementowany został jako część środowiska LiveWire, działającego w połączeniu z serwerami Fast Track lub Enterprise Web Serwer firmy Netscape. Serwer WWW firmy Microsoft, Internet Information Server, także udostępnia język JavaScript pozwalający na tworzenie aplikacji wykonywanych przez serwer.

Dlaczego miałbyś używać języka JavaScript?

Odpowiedź na to pytanie zależy w pewnym stopniu od możliwości, jakich dostarcza język JavaScript. Wraz z rozwojem JavaScript oraz technologii pokrewnych, skrypty pisane w tym języku uzyskują możliwość kontroli wszelkich aspektów stron WWW i formularzy oraz bezpośredniej komunikacji z wyświetlanymi pluginami i apletami.

Podstawowe, najprostsze, możliwości JavaScriptu pozwalają na wykonywanie w przeglądarce wielu prostych (oraz całkiem skomplikowanych) progra­mistycznych zadań, które wcześniej można było rozwiązać tylko i wyłącznie za pomocą prog­ramów CGI wykonywanych na serwerze. Prócz tego, JavaScript umożliwia weryfikację poprawności danych wprowadzanych przez użytkowników w for­mula­rzach. W końcu, w połączeniu z zastosowaniem ramek, JavaScript daje bardzo szero­kie możliwości tworzenia nowych metod prezentacji dokumentów na WWW.

Łatwość użytkowania

W odróżnieniu od języka Java, JavaScript został zaprojektowany z myślą o osobach, które nie miały wcześniej nic wspólnego z programowaniem. Jako taki, JavaScript jest względnie łatwy w użyciu i o wiele mniej wymagający, jeśli chodzi o precyzyjne stosowanie typów zmiennych. Co więcej, nie musisz kompilować kodu programów pisanych w języku JavaScript przed ich użyciem; jest to cecha, której nie posiada bardzo wiele innych języków programowania, włącznie z Javą. Pomimo to, JavaScript wciąż jest językiem trud­niejszym do opanowania od języka HTML (choć z drugiej strony, jest on znacznie prostszy od Javy). Osoba bez żadnego przygotowania programistycznego może używać języka JavaScript do tworzenia bardzo pros­tych programów, takich jak przedstawione w tym rozdziale. Bardziej skomplikowane zastoso­wania będą wymagały poznania głównych pojęć i technik programi­stycznych.

Polepszanie efektywności serwera

Wraz ze wzrostem liczby użytkowników WWW, coraz więcej najpopularniejszych serwe­rów zbli­ża się do granicy swoich możliwości przetwarzania. W związku z tym, większość operatorów WWW szuka nowych sposobów zredukowania obcią­żenia ich systemów oraz uniknięcia kosztownego unowocześniania posiadanych komputerów. Takie właśnie były po­wody stworzenia map graficznych obsługiwanych przez przeglądarki (omówionych w roz­dzia­le 16. „Tworzenie i stosowanie map odsyłaczy”).

Wraz z pojawieniem się języka JavaScript twórcy stron WWW zyskali nowe możliwości. Załóżmy, że stworzyłeś formularz do wprowadzania szczegółowych informacji potrzebnych do działania Twojego systemu zamówień. Gdy formu­larz zostaje wysłany, program CGI musi w pierwszej kolejności sprawdzić otrzymane infor­macje i upewnić się, czy wszystkie pola for­mularza zostały poprawie wypełnione. Między innymi skrypt będzie musiał sprawdzić, czy zo­stało podane nazwisko osoby zamawiającej, wybrana została metoda płatności, czy podano numer karty kredytowej, itp.

Co się stanie, gdy Twój program CGI odkryje, iż brakuje bardzo istotnych informacji? W takim wypadku będziesz musiał poinformować użytkownika o zaistniałych problemach oraz poprosić go o ponowne wypełnienie i przesłanie formularza. Taki proces wymaga uży­cia wielu zasobów po stronie serwera (wykonanie każdego programu CGI wy­maga wolnej pa­mięci operacyjnej oraz czasu procesora), jak również czasochłonnego nawiązywania po­łączeń sieciowych między klientem a serwerem.

Dzięki przeniesieniu wykonania wszystkich czynności sprawdzających poprawność przesy­łanych danych na stronę przeglądarki, co jest możliwe w skryptach pisanych w języku JavaScript, można uniknąć konieczności wielokrotnego przesyłania danych do serwera (gdyż tylko jeden komplet poprawnych danych zostanie przesłany). To rozwiązanie ma także korzystny wpływ na efektywność pracy serwera, ponieważ program CGI nie musi już sprawdzać poprawności danych, co umożliwia zmniejszenie zasobów systemowych pot­rzeb­nych do wykonania programu.

JavaScript a dostawcy usług internetowych

Wielu dostarczycieli usług internetowych, z powodu konieczności zapewnienia odpowied­nie­go poziomu bezpieczeństwa systemu, wprowadza bardzo poważne ograniczenia możli­wości skryptów CGI. Dzięki zastosowaniu skryptów JavaScript da się odzyskać wiele z ut­raconych w ten sposób możliwości. Zastosowanie skryptów umożliwia bowiem wykonanie w przeglą­darce wielu czynności wykonywanych uprzednio na serwerze.

Znaczna większość dostarczycieli usług internetowych umożliwia stosowanie prostych skryp­tów CGI, na przykład skryptów, które pobierają dane przesyłane z formula­rza i zapi­sują je w pliku dyskowym lub przesyłają do właściciela węzła. Jednakże, w przy­padku ko­nieczności zastosowania bardziej skomplikowanego przetwarzania danych, niejed­nokrotnie trzeba było zmieniać dostawcę usług internetowych lub nawet „stawiać” własny ser­wer. Teraz jed­nak, dzięki użyciu skryptów JavaScript, nie będzie już mowy o takich proble­mach.

Posłużenie się skryptami służącymi do obsługi danych z formularzy, dostarczanych przez Twojego dostawcę usług internetowych wraz z procedurami JavaScript w stronach WWW, umożliwi pełną obsługę formularzy nawet na najbardziej zabezpieczanych serwerach WWW. Co więcej, po wprowadzeniu pełnej integracji pomiędzy Javą, JavaScriptem oraz dodatkami rozszerzającymi możliwości przeglądarek, będziesz mógł wykonywać w stro­nach WWW czynności, o których nigdy Ci się nie śniło i których nawet najlepsze progra­my CGI nie były w stanie wykonać.

Znacznik <SCRIPT>

Aby umożliwić umieszczanie programów napisanych w języku JavaScript na stronach WWW, firma Netscape zaproponowała wprowadzenie nowego znacznika — <SCRIPT>. Umiesz­czając ten znacznik wewnątrz dokumentu HTML, instruujesz przeglądarkę, aby kolejne linie dokumentu traktowała jako skrypt, a nie jak normalny kod HTML. Kod do­kumentu trakto­wany jest jako skrypt aż do momentu napotkania znacznika </SCRIPT>; zawar­tość dokumentu umieszczona po tej etykiecie będzie traktowana jako kod źródłowy strony.

Jeśli znacznik <SCRIPT> użyty jest wewnątrz dokumentu HTML, to musi on posiadać atry­but LANGUAGE, deklarujący użyty język skryptowy. Aktualnie można stosować jedynie dwie wartości tego atrybutu: LANGUAGE="LiveScript" lub LANGUAGE="JavaScript". Nazwa „LiveScript” pochodzi z czasów, gdy firma Netscape rozpoczynała tworzenie języka JavaScript. Wraz z pojawieniem się przeglądarki Netscape Navigator 2.0, pierwszej wersji umożliwiającej wykonywanie skryptów, nazwa języka została oficjalnie zmieniona na JavaScript. Dlatego też aktualnie używanie atrybutu LANGUAGE="LiveScript" nie jest zale­cane.

	Do tej pory język JavaScript pojawił się już w trzech wersjach w przeglądarkach Netscape Navigator oraz w dwóch wersjach w przeglądarkach Microsoft Internet Explorer. Oznacza to, że dostępnych jest już kilka wartości atrybutu LANGUAGE. W przeglądarce Netscape Navigator 3 język JavaScript został rozszerzony do wersji 1.1. W przeglądarce Netscape Navigator 4 pojawiła się kolejna, rozbudowana wersja języka — JavaScript 1.2 . W Navigatorze 4.5 dostępna jest natomiast wersja JavaScript 1.3.

Struktura skryptów pisanych w języku JavaScript

Umieszczając skrypty JavaScript w kodzie dokumentów HTML, oprócz użycia znacznika <SCRIPT>, powinieneś przestrzegać także kilku dodatkowych zasad.

• Pamiętaj, aby znacznik <SCRIPT> umieszczać pomiędzy znacznikami <HEAD> i </HEAD> na początku dokumentu, a nie pomiędzy znacznikami <BODY> i </BODY>. Nie jest to wymóg obowiązkowy, lecz raczej udogodnienie wynikające z tego, iż kod skryptów nie powinien być widoczny jako treść strony WWW, a tak byłby on traktowany w przypadku umieszczenia znacznika <SCRIPT> wewnątrz znaczników <BODY>. Kod skryptów powinien być umieszczany w nagłówku dokumentu wraz ze wszelkimi innymi znacznikami informacyjnymi i kontrolnymi, takimi jak <META> i <TITLE>.

• Starsze przeglądarki, które nie potrafią wykonywać skryptów JavaScript, będą próbowały traktować ich kod jako normalny kod HTML. Dlatego też umieszczaj cały kod skryptów wewnątrz komentarzy: <!-- i -->. Jest to niesłychanie istotne. Takie postępowanie zagwarantuje, iż kod skryptu nigdy i w żadnej przeglądarce nie będzie wyświetlany jako treść strony.

• W odróżnieniu od języka HTML, w którym komentarze umieszczane są wewnątrz znaków: <!-- oraz -->, wewnątrz skryptów JavaScript komentarze rozpoczynają się od znaków: //. Wszystkie linie skryptu, które rozpoczynają się od tych znaków, będą traktowane jako komentarz i pomijane.

Uwzględniając wszystkie powyższe reguły, struktura strony WWW zawierającej skrypty JavaScript, powinna mieć następującą postać:

<HTML>

<HEAD>

<TITLE>Przykładowy skrypt w Javie</TITLE>

<SCRIPT LANGUAGE="JavaScript">

<!-- Użyj znacznika początku komentarza, by ukryć kod JavaScript

// Tutaj rozpoczyna się kod JavaScript

// zamknij znacznik komentarza w linii bezpośrednio przed znacznikiem </SCRIPT> -->

</SCRIPT>

</HEAD>

<BODY>

Tu wstaw swój dokument

</BODY>

</HTML>

Atrybut SRC

Oprócz atrybutu LANGUAGE znacznik <SCRIPT> może posiadać jeszcze jeden atrybut — SRC. Użycie go pozwala na zastosowanie wewnątrz strony WWW skryptu zapisanego w zupełnie innym, niezależnym pliku. Ta możliwość jest bardzo przydatna, gdy kilka stron WWW korzysta z tego samego skryptu JavaScript oraz, gdy nie chcesz umieszczać kodu tego skryptu we wszystkich stronach.

Gdy będziesz chciał użyć tego atrybutu, znacznik <SCRIPT> przyjmie następującą pos­tać:

<SCRIPT LANGUAGE="JavaScript" SRC="http://www.serwer.com/script.js">

W powyższej etykiecie skrypt może być dowolnym relatywnym lub absolutnym adresem URL; .js jest rozszerzeniem plików zawierających kod źródłowy skryptów napisanych w ję­zyku JavaScript.

Podstawowe polecenia i struktura języka

Jedną z podstaw języka JavaScript jest obiektowe podejście do programowania. Oznacza to, że wszystkie elementy stron WWW są traktowane jako obiekty, które są grupowane i wspólnie tworzą strukturę odpowiadającą zawartości całej strony.

W tej strukturze wszystkie elementy jednej strony WWW umieszczone są w jednym, pod­stawowym obiekcie (kontenerze) zwanym oknem (ang. window). Wewnątrz tego obiektu znajdują się kolejne obiekty (i kontenery), w których przechowywane są informacje o róż­nych elementach strony. Poniżej przedstawione zostały główne obiekty.

location	Wewnątrz obiektu location przechowywane są informacje o położeniu aktualnej strony WWW, w tym pełny adres URL oraz poszczególne jego elementy, takie jak: domena, port, ścieżka czy też protokół.
history	W tym obiekcie zapamiętane są adresy wszystkich witryn WWW, które zostały odwiedzone w podczas aktualnej sesji. Obiekt history udostępnia również metody zmiany aktualnie wyświetlanej strony.
document	Obiekt ten zawiera komplet informacji dotyczących aktualnej strony WWW. Informacje te dotyczą wszystkich formularzy i ich ele­mentów, hiperłączy oraz kotwic. Co więcej, obiekt ten udostępnia wiele metod, pozwalających na programistyczną modyfikację zawartości takich elementów strony, jak pola tekstowe, pola wyboru czy inne elementy formularzy.
form	Obiekt form zawiera informacje o formularzu umieszczonym w aktu­alnej stronie. Informacje te dają dostęp do programu obsługi formularza (atrybutu ACTION) oraz metody przesyłania danych formularza (atrybutu METHOD). Obiekt ten zawiera także inne obiekty odpowiadające wszystkim elementom umieszczony na formularzu (polom, listom, przyciskom, itp.).

Kompletną listę obiektów dostępnych w języku JavaScript możesz znaleźć w witrynie inter­netowej firmy Netscape, pod adresem http://developer.netscape.com/docs/manuals/index.html.

Właściwości i metody

We wszystkich obiektach dostępne są dwa rodzaje zasobów: właściwości oraz metody.

Właściwości są zmiennymi przechowującymi wartości opisujące obiekt, którym jesteś zain­te­resowany. Dla przykładu, w obiekcie document dostępna jest właściwość title zawiera­jąca tytuł dokumentu określony za pomocą znacznika <TITLE>.

W kodzie skryptu JavaScript dostęp do tej właściwości możesz zdobyć za pomocą polecenia: document.title. Lewa strona tego polecenia określa obiekt, z którym chcesz pracować, a prawa, znajdująca się z prawej strony znaku kropki (.), interesującą Cię właściwość.

Właściwości są zmiennymi przechowującymi różne atrybuty obiektów stosowanych w języku JavaScript. Dostęp do wartości właściwości możliwy jest za pomocą polecenia o postaci: obiekt.właściwość.

Poniżej podane zostały przykłady kilku właściwości.

document.bgcolor	Kolor tła strony.
document.fgcolor	Kolor tekstu strony.
document.lastModified	Data ostatniej modyfikacji strony.
document.title	Tytuł aktualnie wyświetlanej strony WWW.
form.action	Adres URL skryptu CGI, służącego do obsługi danych wpisywanych do formularza.
location.hostname	Nazwa serwera, na którym umieszczona jest aktualna strona WWW.

Pełną listę właściwości wszystkich obiektów dostępnych w języku JavaScript możesz znaleźć w dokumentacji języka pod adresem http://developer.netscape.com/docs/manuals/index.html.

Metody są programistycznymi poleceniami skojarzonymi bezpośrednio z konkretnym obiektem. Dla przykładu, obiekt document udostępnia metodę o nazwie write, umożliwiającej wyświetlanie podanego tekstu bezpośrednio na stronie WWW. Metoda ta ma następującą postać:

document.write("Pokój światu");

Postać wywołania (wykonania) metody jest bardzo podobna do postaci odwołania do właś­ciwości: w pierwszej kolejności należy podać nazwę obiektu, następnie kropkę (.) i  nazwę wywoływanej metody. Dodatkowo, po nazwie metody należy umieścić parę nawiasów (). W nawiasach tych można umieścić argumenty przekazywane do metody, na przykład, jeśli metoda operuje na liczbach, liczby te można umieścić właśnie wewnątrz nawiasów. W powyższym przykładzie argumentem metody write() jest łańcuch znaków, który zosta­nie wyświetlony na stronie.

Metoda jest specjalną funkcją, która wykonuje czynności związane z obiek­tem. Wykonać (lub wywołać) metodę możesz, podając nazwę obiektu i nazwę metody, oddzielonych od siebie za pomocą kropki (.). Po nazwie metody należy umieścić parę nawiasów, w której mogą zostać podane argumenty wywołania metody.

Pamiętaj, iż nawet jeśli metoda nie pobiera żadnych argumentów, musisz dodać za jej naz­wą parę nawiasów. Dla przykładu, metoda toString() obiektu location, używana do zwróce­nia adresu URL aktualnie wyświetlonej strony WWW w postaci łańcucha znaków, nie wyma­ga podania żadnych argumentów, pomimo to, w jej wywołaniu muszą zostać użyte nawiasy: location.toString().

Oprócz właściwości, wszystkie obiekty posiadają metody, których możesz używać w swo­ich programach JavaScript. Pełną listę dostępnych metod znajdziesz na WWW wraz z listą właściwości, poniżej podałam kilka przykładowych metod.

document.write(string)	Metoda wpisuje kod HTML lub tekst do aktualnej strony WWW, argument string określa tekst, który ma zostać wyświetlony.
form.submit()	Wywołanie tej metody powoduje wysłanie formularza.
window.alert(string)	Powoduje wyświetlenie okienka dialogoweg, argu­ment string jest łańcuchem znaków, który zostanie wyświetlony w okienku.
window.open(URL, nazwa)	Metoda powoduje otworzenie nowego okna przeglądarki. Argument URL jest adresem strony, która zostanie wyświetlona w nowym oknie, a argument nazwa jest naz­wą nowego okna przeglądarki.

Dzięki połączeniu metod document.write() i location.toString() oraz właściwości document.title, można stworzyć prosty skrypt przedstawiony poniżej. Wyniki jego wykona­nia pokazane zostały na rysunku 19.1.

		<HTML> <HEAD> <TITLE>Przykładowy skrypt Javy</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- ukryj przed starszymi przeglądarkami document.write(document.title + "<BR>"); document.write(location.toString()); // zakończenie ukrycia --> </SCRIPT> </HEAD> </HTML>
Rysunek 19.1 Wyniki wykonania Twojego pierwszego skryptu w języku JavaScript
		W nazwach metod, właściwości oraz zmiennych w języku JavaScript uwzględniane są wielkości liter. Litery duże i małe są traktowane jako zupełnie różne. Jeśli masz jakiekolwiek problemy z uruchomieniem powyższego przykładu, to sprawdź, czy poprawnie napisałeś nazwy metod location.toString() oraz document.write().

Zdarzenia i JavaScript

Choć użycie metod, takich jak document.write(), do tworzenia stron WWW może mieć jakieś praktyczne zastosowania, to jednak prawdziwa potęga języka JavaScript leży w jego umiejętności odpowiadania na zdarzenia.

Zdarzenia są czynnościami zachodzącymi w stronach WWW, gdy użytkownik prowadzi inter­akcję ze stroną. Dla przykładu, gdy użytkownik wpisuje tekst w polu formularza lub używa przycisku, generowana jest określona sekwencja zdarzeń, które mogą być wyzwolo­ne w prze­glądarce, przechwycone (zazwyczaj pod postacią funkcji) i obsłużone w progra­mie napisanym w języku JavaScript.

Zdarzenia są specjalnymi akcjami wyzwalanymi pod wpływem czynności zachodzących w systemie (na przykład, otwarcia okna, załadowania strony, wysłania formularza) lub czynności wykonywanych przez użytkownika (wpisanie tekstu w polu, kliknięcie przycisku, zaznaczenie pola wyboru). Dzięki użyciu języka JavaScript, możesz wykonywać różnego typu czynności w odpowiedzi na zgłaszane zdarzenia.

Funkcje

Funkcje są podobne do metod, różnica polega na tym, iż metody są skoja­rzone z obiektami, natomiast funkcje są zupełnie niezależne i mogą być wykonywane poza kontekstem obiek­tów. Aby zdefiniować metodę w stronie WWW, będziesz musiał posłużyć się następującą kon­strukcją:

<SCRIPT LANGUAGE="JavaScript">

function nazwafunkcji (argumenty) {

Tutaj znajdują się operacje wykonywane przez funkcję

}

</SCRIPT>

W powyższym przykładzie nazwaFunkcji jest dowolną nazwą, jaką możesz nadać tworzonej funkcji, a argumenty to lista wartości, które chcesz do niej przekazywać. Za definicją fun­kcji, wewnątrz pary nawiasów klamrowych umieścić należy instrukcje, które funkcja ma wykony­wać. Instrukcje te mogą być dowolnymi obliczeniami, sprawdzeniem poprawności danych w formularzu lub czymkolwiek innym.

	JavaScript dostarcza także grupę wbudowanych obiektów oraz funkcji, pozwalających na wykonywanie operacji matematycznych, manipulowanie łańcuchami znaków, datami oraz czasem. Pełną listę dostępnych funkcji możesz znaleźć w dokumentacji języka.

Przypisywanie funkcji zdarzeniom

Po zdefiniowaniu funkcji, kolejnym krokiem będzie przypisanie ich do zdarzeń, które chcesz przechwytywać i obsługiwać. Przechwytywanie zdarzeń możliwe jest poprzez przy­pisywanie procedur obsługi zdarzeń różnym obiektom stron WWW i formularzy. Aktualnie dostępne procedury obsługi zdarzeń przedstawione zostały w tabeli 23.1.

Tabela 23.1: Procedury obsługi zdarzeń dostępne w języku JavaScript

Procedura obsługi	Kiedy jest wywoływana
onBlur	Zawsze, gdy użytkownik opuszcza aktywne pole.
onChange	Zawsze, gdy użytkownik zmieni zawartość aktywnego pola.
onClick	Gdy użytkownik kliknie określony przycisk.
onFocus	Gdy użytkownik uaktywni określone pole.
onLoad	Za każdym razem, gdy załadowana zostanie strona WWW.
onMouseOver	Zawsze, gdy użytkownik umieści wskaźnik myszy na określonym polu.
onSelect	Zawsze, gdy użytkownik zaznaczy zawartość pola.
onSubmit	Za każdym razem, gdy przesłana zostanie zawartość formularza.
onUnload	Za każdym razem, gdy zmieniana jest aktualnie wyświetlana strona WWW.

Aby określić funkcje, które mają zostać skojarzone z dowolnymi zdarzeniami przedstawio­nymi powyżej, będziesz musiał podać nazwę odpowiedniej procedury obsługi zdarzenia, jako atrybut pola, którego działanie chcesz kontrolować. Dla przykładu rozpatrzmy standar­dowy formularz zawierający kilka pól tekstowych oraz przycisk do wysyłania danych:

<FORM METHOD="POST" SRC="../cgi-bin/form">

<INPUT TYPE="TEXT NAME="username">

<INPUT TYPE="TEXT NAME="emailAddress">

<INPUT TYPE="SUBMIT">

</FORM>

Jeśli do znacznika <FORM> dodasz atrybut onSubmit="return checkform( this )", to przed przesłaniem danych z formularza wykonana zostanie funkcja checkform(). Wewnątrz tej funkcji możesz wykonać, na przykład, sprawdzenie poprawności danych wpisanych w for­mularzu, jeśli pojawią się jakiekolwiek problemy, będziesz mógł przerwać wysyłanie da­nych i poprosić użytkownika o poprawę wpisanych informacji. Parametr this przekazy­wany jako argument wywołania funkcji, umożliwia określenie obiektu skojarzonego ze zna­cznikiem <FORM>.

Sprawdzenia poprawności pól formularza możesz także dokonać poprzez określanie proce­dur obsługi zdarzeń onBlur oraz onChange w poszczególnych znacznikach <INPUT>. Bardzo dobrze nadaje się do tego celu procedura onBlur, gdyż jest wykonywana za każdym ra­zem, gdy użytkownik opuszcza pole.

W przypadku przycisków możesz także definiować procedury obsługi zdarzenia onClick, które wykonywane będą za każdym razem, gdy użytkownik kliknie odpowiedni przycisk. Na przykład, umieszczenie w formularzu znacznika <FORM TYPE="SUBMIT" onClick= "processclick()"> spowoduje wykonanie funkcji obslugaClick() za każdym razem, gdy kliknięty zostanie przycisk do wysyłania danych wpisanych w formula­rzu.

	W języku JavaScript wprowadzony został nowy typ przycisku — <INPUT TYPE="BUTTON"> — powoduje on umieszczenie na stronie normalnego przycisku.

Zmienne

Oprócz właściwości język JavaScript pozwala także na przypisywanie i pobieranie wartości zmiennych. Zmienne są definiowanymi przez użytkownika pojemnikami, w którym można przechowywać liczby, łańcuchy znaków lub obiekty. Jednakże, w odróżnieniu od większoś­ci innych języków programowania wysokiego poziomu, narzucających konieczność precy­zyjnego określenia typu zmiennych, w JavaScript typ zmiennych nie jest określany. Dlatego mówi się, iż JavaScript jest językiem o łagodnej kontroli typów. Oznacza to, iż w JavaScript, podczas definiowania zmiennych, nie trzeba określać typu informacji, które będą w nich przechowywane. Ta sama zmienna może służyć do przechowywania informacji dowolnych typów, w zależności od Twoich aktualnych potrzeb.

Poniżej podana została postać deklaracji zmiennej w języku JavaScript:

var nazwaZmiennej = wartość;

W powyższym przykładzie nazwaZmiennej jest unikalną nazwą, którą chcesz nadać zmien­nej. Znak równości umieszczony z prawej strony nazwy zmiennej zwany jest operatorem przy­pisania. Informuje on, że cokolwiek znajduje się z prawej strony operatora powinno zostać zapisane jako wartość zmiennej. Wartość ta może być czymkolwiek, łańcuchem znaków, liczbą, właściwością lub wynikiem wykonania funkcji. Poniżej podanych zostało kilka przykła­dów:

var nazwisko = "Laura Lemay";

var wiek = 28;

var tytul = document.title;

var dokumenturl = location.toString();

var mojatablica = new Array(10);

var dzisiejszadata = new Date();

var mojenazwisko = anothername;

	Nazwy zmiennych i funkcji mogą zawierać litery (od a do z), cyfry oraz znak podkreślenia (_) ,nie mogą jednak zaczynać się od cyfry.
	Jeśli deklarujesz zmienną wewnątrz funkcji, to będziesz miał do niej dostęp jedynie wewnątrz tej funkcji. Zjawisko to określane jest mianem zakresu widzialności zmiennych. Jeśli jednak zadeklarujesz zmienną wewnątrz znacznika <SCRIPT> poza jakąkolwiek funkcją, to będziesz miał do niej dostęp w dowolnym miejscu programu.

Operatory i wyrażenia

Po zdefiniowaniu zmiennej będziesz mógł używać jej zawartości lub modyfikować ją za po­mocą operatorów. W tabeli 19.2 przedstawione zostały niektóre, najczęściej wykorzysty­wane operatory oraz przykłady ich zastosowania. (Podobnie jak w przypadku metod i właś­ciwości, także i teraz pełną listę dostępnych operatorów możesz znaleźć w dokumentacji języka.)

	Równania przedstawione w drugiej kolumnie tabeli 19.2 nazywane są wyrażeniami. Mówiąc jak najprościej, wyrażenie jest poprawnie sformułowaną grupą zmiennych, operatorów oraz innych wyrażeń, której wykonanie powoduje zwrócenie wartości. Dla przykładu, b+c powoduje zwrócenie wartości, która może być następnie zapisana w zmiennej a.

Tabela 19.2: Operatory i wyrażenia dostępne w języku JavaScript

Operator	Przykład	Opis
+	a = b + c	Dodaje wartości zmiennych b i c oraz zapisuje wynik w zmiennej a.
-	a = b - c	Odejmuje wartość zmiennej c od wartości zmiennej b i wynik zapisuje w zmiennej a.
*	a = b * c	Mnoży wartości zmiennych b i c, a wynik zapisuje w zmiennej a.
/	a = b / c	Dzieli wartość zmiennej b przez wartość zmiennej c i wynik zapisuje w zmiennej a.
%	a = b % c	Oblicza resztę z dzielenia wartości zmiennej b przez wartość zmiennej c i wynik zapisuje w zmiennej a.
++	a = ++b	Inkrementuje wartość zmiennej b (zwiększa ją o 1) i wynik zapisuje w zmiennej a.
--	a = --b	Dekrementuje wartość zmiennej b (zmniejsza ją o 1) i wynik zapisuje w zmiennej a.

W języku JavaScript dostępne są także specjalne operatory powstałe poprzez połączenie operatora przypisania (=) oraz innego operatora. Operatory powstałe z takiego połączenia nazywane są operatorami przypisania. Zostały one przedstawione w tabeli 19.3.

Tabela 19.3: Operatory przypisania dostępne w języku JavaScript

Operator		Przykład	Opis
+=		a += b	Ten przykład równoważny jest poleceniu a = a + b.
-=		a -= b	Ten przykład równoważny jest poleceniu a = a - b.
*=		a *= b	Ten przykład równoważny jest poleceniu a = a * b.
/=		a /= b	Ten przykład równoważny jest poleceniu a = a / b.
%=		a %= b	Ten przykład równoważny jest poleceniu a = a % b.
		Operatory + oraz += mogą być używane zarówno do operowania na liczbach, jak i na łańcuchach znaków. W przypadku użycia ich na łańcuchach znaków powodują połączenie dwóch łańcuchów w jeden, na przykład, "łańcuch 1" + "łańcuch 2" daje w wyniku "łańcuch 1 łańcuch 2".

Podstawy programowania
w języku JavaScript

Aby połączyć wszystkie procedury obsługi zdarzeń, tj. metody, parametry, funkcje, zmienne oraz operatory, JavaScript wprowadza prosty zbiór instrukcji przypominających instrukcje dostępne w BASIC-u lub Javie.

Jeśli masz jakiekolwiek doświadczenie programistyczne, to poświęcenie kilku minut na przeglądnięcie dokumentacji firmy Netscape dotyczącej instrukcji w JavaScripcie pozwoli Ci na rozpoczęcie pisania swoich własnych programów w tym języku. Jeśli jednak nie masz żadnego doświadczenia programistycznego, to w dalszej części tego rozdziału znajdziesz podstawowe informacje, które będą niezbędne w dalszej pracy.

Czym jest program?

Niezależnie do używanego języka programowania, program jest zawsze zbiorem instrukcji opisujących, w postaci zrozumiałej dla komputera, czynności, które chcesz wykonać. W naj­prostszym przypadku wykonywanie programu rozpoczyna się na samym początku listy in­strukcji, po czym kolejno wykonywane są wszystkie, aż do samego końca prog­ramu. Tak dzieje się w poniższym przykładzie:

<SCRIPT LANGUAGE="JavaScript">

// początek programu - UWAGA: linie rozoczynające się symbolem '//'
// traktowane są, jako komentarz

document.write(document.title + "<BR>");

document.write(location.toString());

// koniec programu

</SCRIPT>

Jednakże rzadko będziesz chciał, aby program był wykonywany w taki prosty sposób, od początku do końca, zwłaszcza w JavaScripcie, wypisanie komunikatu na stro­nie WWW jest znacznie prostsze w HTML-u niż w skryptach JavaScript. Z tego powodu większość języków programowania udostępnia grupę instrukcji umożliwiających modyfiko­wanie sposobu wykonywania programu.

Instrukcja if

Pierwsza instrukcja, która pozwala na modyfikowanie sposobu wykonywania programu nazywana jest instrukcją if. Umożliwia ona stworzenie bloków kodu, które zostaną wykonane wyłącznie w przypadku, gdy zostanie spełniony konkretny warunek. Załóżmy, że dysponujesz formularzem, w którym użytkownik powinien podać swoją płeć. W takim wy­padku możesz powitać użytkownika w odpowiedni sposób, zależny od jego płci:

if ( form.theSex.value == "male" ) {

document.write("Dziękujemy Panu za odpowiedź");

}

if ( form.theSex.value == "female" ) {

document.write("Dziękujemy Pani za odpowiedź");

}

Jeśli powyższy fragment kodu zostałby uruchomiony oraz właściwość form.theSex.value przyjęłaby wartość "male", to wykonana byłaby pierwsza metoda document.write(). Jeśli jednak właściwość ta przyjęłaby wartość "female", to zostałaby wykonana druga metoda document.write().

Blok kodu umieszczony z prawej strony instrukcji if powoduje porównanie wartości właś­ciwości form.theSex.value z łańcuchem znaków "male". Porównanie to kontrolowane jest przez operator porównania. W naszym przypadku operator == określa, czy obie wartości są równe. Wszystkie operatory porównania dostępne w języku JavaScript zostały przedsta­wione w tabeli 19.4.

Tabela 19.4: Operatory porównania dostępne w języku JavaScript

Operator	Opis operatora	Uwagi
==	Równy	a == b: sprawdza, czy a jest równe b.
!=	Różny	a != b: sprawdza, czy a jest różne od b.
<	Mniejszy	a < b: sprawdza, czy a jest mniejsze od b.
<=	Mniejszy lub równy	a<= b: sprawdza, czy a jest mniejsze lub równe b.
>=	Większy lub równy	a >= b: sprawdza, czy a jest większe lub równe b.
>	Większy	a > b: sprawdza, czy a jest większe od b.

Instrukcja if … else

Poprzedni przykład możesz także zapisać w nieco odmienny sposób, używając postaci instrukcji if, zawierającej instrukcję else:

if ( form.theSex.value == "male" ) {

document.write("Dziękujemy Panu za odpowiedź");

}

else {

document.write("Dziękujemy Pani za odpowiedź");

}

W tym przykładzie nie potrzebujesz sprawdzenia drugiego warunku, w końcu jeden użyt­kownik jest tylko mężczyzną lub tylko kobietą. Dlatego też możesz użyć instrukcji else, która informuje program o tym, aby w przypadku, gdy test wypadnie niepomyślnie, wykonana została druga metoda document.write.

	W obu powyższych przykładach, w miejscu wywołania metod document.write() mogłaby zostać podana dowolna ilość instrukcji, jedynym warunkiem jest to, że musiałyby one zostać umieszczone wewnątrz odpowiedniej pary nawiasów klamrowych.

Pętle

Czasami będziesz chciał, aby określona grupa instrukcji była wykonywana ściśle podaną ilość razy. Język JavaScript dostarcza dwóch rodzajów tak zwanych „pętli”, czyli instrukcji pozwalających na kilkukrotne wykonanie tej samej grupy instrukcji. Pierwsza z nich, zwana „pętlą for”, jest idealna w sytuacjach, gdy chcesz, aby grupa instrukcji wykonana została ściśle określoną ilość razy. Druga pętla, „while”, lepiej nadaje się w sytuacjach, gdy ilość powtórzeń zależna jest od jakiegoś zewnętrznego warunku.

Pętla for

Podstawowa struktura pętli for wygląda następująco:

for (var ilosc = 1; ilosc <= 10; ++ilosc) {

tu wstaw wyrażenia

}

W powyższym przykładzie zmienna ilosc jest deklarowana i od razu przypisana jej zostaje wartość 1. Następnie wykonane jest sprawdzenie, czy wartość zmiennej ilosc jest mniej­sza od 10. Jeśli tak jest, wykonywane są wszystkie instrukcje wewnątrz pętli for (umieszczone w nawiasach klamrowych {}). Następnie wartość zmiennej ilosc jest inkremento­wana (zgodnie z instrukcją ++ilosc), po czym ponownie sprawdzana jest wartość tej zmiennej (warunek ilosc <= 10). Jeśli warunek wciąż jest prawdziwy, to instrukcje wew­nątrz pętli zostaną ponownie wykonane. W powyższym przykładzie instrukcje wewnątrz pętli będą wykonywane aż do momentu, gdy wartość zmiennej ilosc będzie większa od 10, w tym momencie pętla zostanie zakończona.

Pętla while

Postać pętli while została podana poniżej:

while (warunek) {

tu wstaw wyrażenia

}

W odróżnieniu od pętli for pętla while nie posiada żadnego wbudowanego mechanizmu mo­dyfikacji zmiennych sterujących pętli, określających moment zakończenia wykonywania pętli. Jedynym czynnikiem określającym koniec pętli while jest warunek logiczny, umiesz­czony w nawiasach z prawej strony instrukcji. Test ten może być dowolnym wyrażeniem zwracają­cym wartość logiczną i wykorzystującym którykolwiek z operatorów logicznych, przedstawio­nych w tabeli 19.4.

Instrukcje umieszczone w pętli (wewnątrz nawiasów klamrowych {}) wykonywane są do­póty, dopóki warunek jest prawdziwy. Jeśli warunek będzie prawdziwy zawsze, to pętla bę­dzie wykonywana w nieskończoność, a przynajmniej do momentu zamknięcia przeglądarki.

	Używając pętli while będziesz musiał zwracać szczególną uwagę na to, aby nie stworzyć pętli nieskończonych. Jeśli jednak uda Ci się taką pętlę stworzyć, to jedyną metodą jej zatrzymania jest zamknięcie przeglądarki.

Dowiedz się więcej o programowaniu w JavaScript

Lista instrukcji, funkcji, właściwości i operatorów jest jedynie fragmentem wszystkich moż­liwości języka JavaScript. W rzeczywistości, język ten jest cały czas rozwijany i zmie­nia się w każdej nowej wersji przeglądarki Netscape Navigator.

Z tego powodu nie można przecenić znaczenia dokumentacji JavaScriptu umieszczonej w wi­trynie internetowej firmy Netscape (patrz rys. 19.2). Wszystkie modyfikacje i zmiany języka będą w pierwszej kolejności opisane w tej dokumentacji. Możesz ją znaleźć pod adresem http://developer.netscape.com/docs/manuals/index.html. Do­kumentacja ta, oprócz opisu wszystkich elementów języka, zawiera wiele infor­macji ogól­nych, takich jak przykłady i podręczniki.

Rysunek 19.2 Dokumentacja JavaScriptu znajdująca się na witrynie internetowej firmy Netscape

Podsumowanie

JavaScript pozwala osobom tworzącym strony WWW na umieszczanie w tworzonych doku­mentach prostych programów, umożliwiając jednocześnie uniknięcie kontaktu z bar­dziej skomplikowanymi językami programowania wysokiego poziomu, takimi jak Java lub C++.

W tym rozdziale poznałeś funkcje znacznika <SCRIPT> oraz sposób użycia go do umiesz­czania skryptów na stronach WWW. Dodatkowo przedstawione zostały podstawy języka JavaScript, podstawowe operatory, instrukcje oraz funkcje.

Dysponując tą podstawową wiedzą, będziesz mógł zapoznać się z prawdziwymi przykłada­mi zastosowania skryptów JavaScript oraz poznać bardziej zaawansowane zagadnienia związane z programowaniem w tym języku.

Warsztat

W tej części rozdziału znajdziesz pytania i odpowiedzi, quiz oraz ćwiczenia związane z językiem JavaScript.

Pytania i odpowiedzi

P. Czy nie potrzebuję jakiegoś środowiska programistycznego, aby móc pisać progra­my w JavaScripcie?

O. Nie. Jedyną rzeczą jakiej potrzebujesz, aby pisać programy w JavaScriptcie jest edytor teks­towy. Może myli Ci się JavaScript z Javą, językiem programowania o znacznie większych możliwościach, gdyż faktycznie, w przypadku Javy, do pisania programów będziesz potrze­bował przynajmniej kompilatora.

P. Czy Java i JavaScript są językami kompatybilnymi?

O. Odpowiedź na to pytanie zależy od tego, co rozumiesz pod pojęciem „kompatybilne”. Większość składni obu tych języków jest bardzo podobna, jednakże podobieństwo pomię­dzy nimi praktycznie na tym się kończy. Nie da się skompilować programów napisanych w języku JavaScript za pomocą kompilatora Javy. Podobnie, programów Javy nie można umieszczać w kodzie dokumentów HTML, tak jak skryptów JavaScript. Programy napisa­ne w języku Java muszą najpierw zostać skompilowane, a następnie dołączone do strony WWW jako specjalne wykonywalne pliki. Natomiast, jak wiesz, kod programów pisanych w języku JavaScript umieszczany jest bezpośrednio w kodzie dokumentów HTML.

W przeglądarce Netscape Navigator 3 wprowadzona została technologia LiveConnect, umożliwiająca wzajemną wyminę informacji pomiędzy Javą, JavaScriptem oraz plug-inami. Dla przykładu, funkcja skryptu JavaScript może wywoływać metodę apletu napisanego w Javie i dołączonego do strony WWW lub metoda apletu może wywoły­wać funkcję skryptu w celu zmodyfikowania zawartości strony. Więcej informacji na temat technologii LiveScript możesz znaleźć w książce pod tytułem „JavaScript” wyda­nej przez wydawnictwo Helion.

P. W Javie oraz języku C++ zmienne definiowane są za pomocą takich słów kluczo­wych (określających typy) jak: int, char lub String. Dlaczego nie mogę postępo­wać podobnie w języku JavaScript?

O. Bo nie możesz. Jak zostało powiedziane wcześniej, JavaScript jest językiem o łagodnej kontroli typów. Oznacza to, że zmienne mogą przyjmować dowolną postać i mogą być zmieniane podczas wykonywania programu; w konsekwencji, typ zmiennej określany jest na podstawie wartości zapisywanej w tej zmiennej.

Quiz

1. Czym język JavaScript różni się od języka Java?

2. Jakie są podobieństwa języków JavaScript i Java (oczywiście, oprócz nazwy)?

3. Jaki znacznik HTML został wprowadzony przez firmę Netscape w celu identyfikacji skryptów?

4. Czym są zdarzenia oraz w jaki sposób można je obsługiwać w języku JavaScript?

5. Jakie są różnice pomiędzy funkcjami i metodami?

Odpowiedzi

1. JavaScript to prosty język wykorzystywany wyłącznie w przeglądarkach WWW; Java to znacznie bardziej rozbudowany język programowania, którego można używać w dowolnych celach.

2. Skrypty pisane w języku JavaScript są wykonywane przez samą przeglądarkę WWW (oczywiście, jeśli dysponuje ona odpowiednimi możliwościami). Dzięki temu skrypty te można wykonywać na dowolnym komputerze oraz w dowolnym systemie operacyjnym, podobnie jak programy napisane w języku Java.

3. Aby umożliwić umieszczanie skryptów w dokumentach HTML, firma Netscape wprowadziła znacznik <SCRIPT>. Znacznik ten informuje przeglądarkę, iż umieszczone za nim linie kodu mają być traktowane jako skrypt, a nie jako zawartość strony WWW.

4. Zdarzenia to specjalne akcje wyzwalane w efekcie zmian stanu systemu operacyjnego lub programu (otworzenie okna, załadowanie strony, przesłanie formularza) albo w rezultacie czynności wykonywanych przez użytkownika (wpisanie tekstu, użycie łącza, zaznaczenie pola wyboru). Dzięki użyciu języka JavaScript można wykonywać czynności w odpowiedzi na pojawienie się konkretnych zdarzeń.

5. Metody są skojarzone z obiektami, natomiast funkcje nie są zależne od jakichkolwiek obiektów i działają poza ich zasięgiem.

Ćwiczenia

1. Jeśli jeszcze tego nie zrobiłeś, to poświęć kilka minut na przejrzenie dokumentacji języka JavaScript dostępnej na witrynie firmy Netscape pod adresem: http://developer.netscape.com/docs/manuals/index.html. Przekonaj się, czy będziesz w stanie odszukać informacje o nowych możliwościach języka JavaScript 1.3, które nie były dostępne w jego poprzedniej wersji 1.2.

2. Odszukaj dowolny skrypt napisany w języku JavaScript, nieważne czy będzie on używany na przeglądanej stronie, czy znajdziesz go w internetowym archiwum, przejrzyj jego kod źródłowy i spróbuj określić jego logikę działania oraz przeznaczenie.

660

HTML 4 - Vadmecum profesjonalisty

659

Tworzenie skryptów w języku JavaScript

23

---