Gazeta Internetowa

 

HTML - częsć trzecia

Wstęp do programowania w HTML

Na razie pozostawimy język znaczników HTML. Wiem jesteście niecierpliwi. Mało jeszcze w nim umiemy, ale dla odwrócenia uwagi i relaksu proponuje przeskok na skrypty. Skrypt to mały program wpisany w stronę HTML, wykonujący pewne z góry określone czynności. W niniejszym kursie poznamy wstęp do programowania w Java Scripcie i Visual Basic Scripcie. Od razu zaznaczam, że wymagam znajomości programowania w C lub Basicu, co najmniej na poziomie przedszkola, gdyż celem tego kursu nie jest nauka programowania, a zastosowanie tych języków w programowaniu HTML.

Basic

Jest to dosyć stary język programowania, używany głównie jako interpreter tzn. w trakcie wykonywania programu tłumaczona jest wersja źródłowa (instrukcja po instrukcji) i wykonywana. Mam wrażenie, że jest to język, którego jest najwięcej wersji. Był to podstawowy język pierwszych mikrokomputerów i przez pewien czas PC.
Obecnie na PC najwięcej jest wersji, gdzie Basic tłumaczony jest do P-Codu (jest to coś pośredniego pomiędzy tekstem wersji źródłowej a kodem maszyny). Przyspiesza to uruchamianie programu, ale wersja ostateczna nie jest dość efektywna. Taka też postać kodu daje często błędy wykonania wynikające z niezbyt drobiazgowego napisania kodu programu. Zaletą natomiast jest wysoka stabilność ostatecznego programu, nawet w przypadków błędów.
Generalnie Basic jest w pogardzany, przez profesjonalistów, głównie z tego względu, że długi czas opierał sie nowościom i swoboda w pisaniu programów doprowadzała do błędów, których nie mają profesjonalne narzedzia. Najpopularniejszym obecnie narzędziem do pisania w Basicu jest Microsoft Visual Basic (obecnie najnowsza jest wersja 6.0). narzędzie to posiada prawie wszystkie cechy profesjonalne i w pracy jest niezwykle łatwe i skuteczne. Można w nim pisac bardzo duże i profesjonalne systemy. Wersję szkolną kupić można za około 10 zł.
Basic jest także elementem pakietu Microsoft Office użytkownicy takiej jego wersji (lub Visual Basica) mogą od razu siąść i pisać skomplikowane skrypty w HTML.

Java

Java natomiast jest językiem bardzo młodym i modnym, jedyną formą jaką tworzy kompilator jest coś w stylu kodu pośredniego, który wygląda identycznie dla wszystkich środowisk programistycznych. Stąd kod wykonany w dowolnym narzędziu i dowolnej maszynie można uruchomić gdziekolwiek indziej, pod warunkiem istnienia Wirtualnej Maszyny Javy czyli środowiska programowego wykonującego taki kod. Posiada go prawie każda przeglądarka HTML. Przeglądarki mają możliwość wykonywania Javy na dwa sposoby:
  • pobrania z sieci (dysku) tak zwanego appletu (plik z rozszerzeniem .class) i uruchomienia zawartego w nim programu, (kodu pośredniego). Uruchomieniu appletu służy znacznik <applet ... > - omówię go przy okazji. Aby wykonać applet należy napisac program źródłowy w pliku z rozszerzeniem .java i dokonać kompilacji, którymś z kompilatorów. Niektóre są darmowe.
  • wykonania instrukcji Javy umieszczonych po prostu w pliku HTML. Tym będziemy się w tym kursie zajmować.
Bardzo pobieżny opis, ale obrazowy i z przykładami jest CHIPIE (nr specjalny kwiecień 1997). Na załączonym kompakcie jest kilka narzędzi do pisania w Javie, a także programy do obróbki grafiki, edytory HTML i kilka dokumentacji tego języka. W samym numerze jest bardzo też ładny opis HTML.

Programowanie w HTML

We wszystkich poniższych przykładach będę podawać skrypty zarówno w Basicu jak i w Javie. Wybór języka pozostawiam do wyboru. Programistom znającym C polecam Javę, natomiast tym co liznęli Basic polecam Basic. Zaznaczam jednak wyraźnie - Basic funkcjonuje tylko na Internet Explorerze i najnowszych wersjach Netscape, Java natomiast wszędzie. Poza MSDN nie spotkałem najkrótszej nawet informacji jak programować HTML w Basicu, opisów Javy jest mnóstwo.
Cele umieszczenia skryptu w dokumencie HTML są następujące:
  • Wykonanie pewnych akcji podczas ładowania strony. Wiele serwerów przy ładowaniu stron wysyła HTML rozpoznający przeglądarkę i w zależności od niej podaje zupełnie inne pliki. Coś takiego widziałem na serwerze WWW.ONET.PL - oddzielne katalogi dla IE i Netscape, nie wiem czy tak jest teraz. Program napisany w skrypcie sam może modyfikować czy tworzyć stronę w zależności od pełnienia pewnych warunków.
  • Wykonywanie pewnych akcji, które w języku znaczników są niemożliwe:
    • Wyświetlanie ruchomej grafiki, jest dużo efektywniejsze i efektowniejsze niż umieszczanie tej samej grafiki w plikach gif lub jpg,
    • Ożywanie obrazu i tekstu (np. poprzez zmianę położenia i wielkości obiektów, bo język znaczników jest statyczny) - stąd nazwa dla "ożywionych" HTML - DHTML (dynamiczny HTML),
    • Dodawanie dodatkowych elementów, dla których brak znaczników,
    dla przyozdobienia HTML,
  • rozumna reakcja na zdarzenia wykonywane przez użytkownika (np. skontrolowanie danych przed wysłaniem), w języku HTML tworzone są całe systemy bankowe, sklepy internetowe itp.
Teraz pare przykładów z komentarzami.
  • Wykonanie akcji podczas ładowania strony - wykonać to można na dwa sposoby - wpisać skrypt po prostu w treść dokumentu HTML lub nie w nie opisany jeszcze przez nas znacznik <body ...> 

      <html>
    <head>
      <meta http-equiv="Content-Type"
         content="text/html; charset=windows-1250">
      <title>Test Javy</title>
    </head>
    <body>
      Teraz leci komunikat :
          <script>
             alert("komunikat")
          </script>
      A teraz po komunikacie
    </body>
  </html>
    i to samo w Basicu 
      <html>
    <head>
      <meta http-equiv="Content-Type"
         content="text/html; charset=windows-1250">
      <title>Test Basica</title>
    </head>
    <body>
      Teraz leci komunikat :
          <script language="vbscript">
             msgbox("komunikat")
          </script>
      A teraz po komunikacie
    </body>
  </html>
    Teraz krótki opis. Nagłówek w obu plikach standardowy. Potem rozpoczyna się tekst Teraz leci komunikat : . Teraz okazuje się, że przeglądarki są niekompatybilne. Internet Explorer zgodnie z kolejnością najpierw puści komunikat na monitor, potem dalsza część tekstu. Netscape najpierw skończy pisanie na monitorze potem puści komunikat.
    Co nowego. W tekście HTML mamy znacznik <script language="vbscript"> lub <script>. To pierwsze to oznaczenie, że dalej nastąpi skrypt w basicu, to drugie, że w języku domyślnym (czyli Java Scripcie). Można też napisać <script language="javascript">. Pomiędzy znacznikami <script> program napisany w odpowiednim języku. Oczywiście Netscape 4.5 tego drugiego jeszcze nie wykona.
    Oba natomiast wykonają identycznie skrypt: 
      <html>
    <head>
      <meta http-equiv="Content-Type"
         content="text/html; charset=windows-1250">
      <title>Test Javy</title>
    </head>
    <body>
      Ten dokument jest wyświetlany w przeglądarce :
      <script>
        document.write(navigator.appName + " "
          + navigator.appVersion)
      </script>
      Mało efektowny, ale ilustruje prawidłowo zagadnienie
    </body>
  </html>
    Jest to skrypt napisany w Javie. W czasie ładowania pomiędzy wierszami tekstu skrypt dopisuje nazwę i wersję przeglądarki. Skrypt w zależności od daty, godziny, rodzaju przeglądarki może zmodyfikować tekst. Ten typ HTML stosowany jest także w plikach ASP (active server pages). Serwer Microsoftu ma zdolność wysyłając w internet pliki (z rozszerzeniem asp) wykonywać wstępną ich obróbkę przed wysłaniem w Internet. Program wygląda tak samo, znacznik ASP <% .. %> jest trochę inny by odróżnić część do wykonania na serwerze i u klienta. Celem takiej technologii jest zmniejszenie transmisji w sieci.
  • Drugi przykład to połączenie dwóch technik - uruchomienie skryptu podczas zdarzenia. Zdarzeniem w tym przypadku jest ładowanie dokumentu. 
      <html>
    <head>
      <meta http-equiv="Content-Type"
         content="text/html; charset=windows-1250">
      <title>Test Javy</title>
    </head>
    <body onload="alert('start strony')">
       To jest zwykła strona
    </body>
  </html>
    Na stronie HTML dowolny skrypt można uruchomić jako reakcję na dowolne zdarzenie np.: ładowanie strony, wciśnięcie przycisku ruch myszą, wejście lub wyjście kursorem z pola itp. W tym przypadku do tego celu wykorzystaliśmy nie opisany jeszcze znacznik <body>.

Szerzej do skryptów powrócimy później. Zazwyczaj związane są z obiektami na ekranie, które tworzone są nieopisanymi dotychczas znacznikami.

Krzysztof Grzegorz Stoler

[spis treści]

Podobała Ci się ta Gazeta ? Powiedz o niej swoim znajomym ! www.gazeta.sky.pl