Wstęp do JavaScriptu Marek Magiera Październik 2003r.

Prezentacja na temat: "Wstęp do JavaScriptu Marek Magiera Październik 2003r."— Zapis prezentacji:

1 Wstęp do JavaScriptu Marek Magiera Październik 2003r.

2 JavaScript a Java JavaScript Interpretowany przez klienta Tworzy skrypty, które mogą być bezpośrednio wstawiane do stron HTML Zorientowany obiektowo Łatwy Java Wykonywany przez klienta Tworzy "aplety", które są wywoływane ze strony HTML, ale nie umieszczane w niej Oparty na obiektach Wymaga doświadczenia programistycznego

3 Obiekty w JavaScript Elementy występujące w oknie przeglądarki www okna, formularze, przyciski itp. posiadające indywidualne nazwy (nie przycisk1 a np. przyciskZamknij) Język zorientowany obiektowo – co to znaczy? (1) Obiekty Elementy występujące w danym środowisku koty, komputery, samochody itp. Obiekty powinny posiadać indywidualne nazwy (nie kot1 a np. mruczek)

4 Właściwości w JavaScript formularze - elementy itp. okna – PasekStanu, PasekNarzędzi Język zorientowany obiektowo – co to znaczy? (2) Właściwości Obiekty mają właściwości koty – futerko, pazurki, brzuch komputery – myszkę, klawiaturę itp. Obiekty można zmieniać modyfikując ich właściwości. Niektóre właściwości mogą być obiektami. Przykładowa właściwość o nazwana pusty może być stosowana tam gdzie ma sens. Brzuch może być pusty, ale futerko – już niebardzo (co to byłby za kot?).

5 Metody w JavaScript okna – otworzyć( ), zminimalizować( ) Nawiasy ( ) oznaczają, że jest mowa o metodzie, a nie o właściwości. Język zorientowany obiektowo – co to znaczy? (3) Metody Obiekty potrafią coś robić i to nazywamy metodami koty – mruczą, drapią komputery – liczą, zawieszają się itp. Obiekty i właściwości to rzeczowniki a metody czasowniki.

6 A w JavaScript okno.zamknij( ) formularz.elementy.przyciskOpcji.kliknij( ) dokument.obrazek.nazwa.ukryj( ) dokument.wypisz( ) Zapis taki nazywamy składnią kropkową. Język zorientowany obiektowo – co to znaczy? (4) Łączenie obiektów, właściwości i metod stosowane jest aby lepiej opisać obiekt lub proces. kot.mrucz( ) kot.łapy.przednie.lewa.drap( )

7 A w JavaScript Zdarzenia to czynności wykonywane przez użytkownika podczas odwiedzania strony www. Przesłanie formularza wywoła zdarzenie onClick( ) formularz.elementy.przyciskOpcji.kliknij( ) Język zorientowany obiektowo – co to znaczy? (5) Zdarzenia Jeśli kot obsługuje zdarzenie przyGłaskaniu( ) może wykonać kot.mrucz( ) kot.łapy.przednie.lewa.nieDrap( )

8 Jak umieszcza się skrypty w dokumencie HTML? (1) W znacznikach SCRIPT Cały skrypt jest objęty znakami komentarza ( ), co gwarantuje, że kod nie zostanie wyświetlony na ekranie nawet przez stare przeglądarki nie obsługujące JS.

9 Jak umieszcza się skrypty w dokumencie HTML? (2) Z atrybutem np. onClick itp. W zasadzie wszystkie elementy dokumentu HTML generują pewne zdarzenia, gdy wystąpią określone okoliczności. Z tymi zdarzeniami można powiązać polecenia JS. A to inne zdarzenia onMouseOver onMouseOut (najechanie i zjazd z obiektu) onMouseDown onMouseUp (wcisnięcie i puszczenie przycisku) onFocus onBlur (wybranie i opuszczenie danego pola formularza) onLoad onUnload onAbort

10 Z osobnego pliku stosujemy gdy skrypt, którego chcemy używać ma dosyć dużą objętość, a korzystamy z niego na kilku podstronach naszego serwisu www większa czytelność kodu łatwiejsza modyfikacja skryptu mniejsza objętość serwisu Jak umieszcza się skrypty w dokumencie HTML? (3)

11 Mój pierwszy skrypt document.write("Elo Ziom!") Przykłady skryptów (1)

12 Mój drugi skrypt document.write (" Witaj "); Przykłady skryptów (2)

13 Mój trzeci skrypt Data ostatniej poprawki document.write (document.lastModified); Przykłady skryptów (3)

14 Przykłady skryptów (4)

15 Mój czwarty skrypt Przykłady skryptów (5)