Wikipedysta:Savix/brudnopis

Programowanie w JavaScripcie

W poprzednim rozdziale pokazane zostały dwie metody wykonywania skryptów. Skupmy się na razie na tej drugiej, gdyż daje ona największe możliwości i z tego powodu jest najczęściej używana.

Zewnętrzny plik ze skryptem

Kod JavaScript może składać się niekiedy z setek, a nawet tysięcy linii kodu. Najlepszym podejściem w takiej sytuacji jest wczytywanie go z zewnętrznego pliku. Potem trzeba tylko wstawić w elemencie <head> naszej strony element <script> z odpowiednimi atrybutami:

<script type="text/javascript" src="nazwa_pliku.js"></script>

Atrybut type określa typ MIME pliku ze skryptem (więcej na ten temat w dalszej części tego rozdziału), zaś src zawiera adres URI pliku ze skryptem. Właśnie ten sposób wykorzystaliśmy w przykładzie z poprzedniego rozdziału:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
 "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
   <head>
     <title>Tytuł</title>
     <script type="text/javascript" src="script.js"></script>
   </head>
   <body>
     <p>Lorem ipsum.</p>
   </body>
</html>

Skrypt bezpośrednio w pliku ze stroną

Są jednak sytuacje, w których lepiej jest załączyć skrypt bezpośrednio w pliku strony, np. gdy korzystamy z gotowej biblioteki, któr

<script type="text/javascript">
// <![CDATA[

Tutaj wstaw swój skrypt

// ]]>
</script>

bla bla bla

<script type="text/javascript">
/* <![CDATA[ */

Tutaj wstaw swój skrypt

/* ]]> */
</script>

Wiele elementów `<script>`

Tutaj ma być ładny przykład (np. TinyMCE)

Element `<noscript>`

Krótka sekcja

Starsze techniki

Bla bla bla

<script type="text/javascript">
// <!--

Kod JavaScript

// -->
</script>

Uwagi odnośnie typu MIME

Obecnie istnieje wiele różnych typów MIME służących do oznaczania skryptów napisanych w JavaScripcie. Do najistotniejszych zaliczają się:

text/javascript - najpowszechniej używany typ dla JavaScriptu, ale przestarzały zgodnie z dokumentem RFC 4329
application/javascript - ma zastąpić text/javascript, ale ciągle nie jest obsługiwany przez wszystkie przeglądarki (brak wsparcia w Internet Explorerze 8 i wcześniejszych)
text/ecmascript - występuje w specyfikacji SVG 1.1, ale znów zgodnie z RFC 4329 jest uznawany za przestarzały
application/ecmascript - podobnie jak wcześniej ma on za zadanie zastąpić text/ecmascript, ale znów nie posiada on wsparcia ze strony wszystkich najważniejszych przeglądarek

Ponieważ formalnie JavaScript jest jedynie jednym z dialektów ECMAScriptu (choć nazw tych w wielu przypadkach używa się zamiennie), to najodpowiedniejszym typem wydaje się application/ecmascript, ale problemy z kompatybilnością nie pozwalają na razie na jego upowszechnienie.

Umieszczanie znacznika

Przeglądarka internetowa nie potrafi sama odróżnić języka JavaScript od treści dokumentu, tak więc musimy wskazać jej gdzie zawiera się treść naszego kodu JavaScript. Należy to zrobić znacznikiem script

<script language="JavaScript">
...
Treść skryptu JavaScript;
...
</script>

Przeglądarki nie obsługujące `script`

Istnieją jednak przeglądarki, które nie rozumieją znacznika script, a przez to treść naszego skryptu, może być bez oporu wyświetlona przez takową przeglądarkę. Należy wtedy umieścić skrypt w komentarzu HTML.

<script language="JavaScript">
<!--
...
Treść skryptu JavaScript;
...
//-->
</script>

`script` w standarcie XHTML

W przypadku standardu XHTML znacznik script uległ pewnej przemianie. Pierwszą rzeczą jest stosowanie typów MIME informujących o typie skryptu. Druga zmiana, to zastosowanie sekcji CDATA, zgodnie ze standardem XML. Sekcja CDATA jest potrzebna do oznaczenia kodu, który nie powinien być stosowany jako znacznik. Ostatecznie, by nasz skrypt był rozpoznawany przez większość przeglądarek będzie osadzony w ten sposób:

<script type="text/javascript" language="JavaScript">
//<![CDATA[
...
Treść skryptu JavaScript;
...
//]]>
</script>

Znacznik `noscript`

Dla przeglądarek nie obsługujących JavaScriptu, możemy przygotować specjalny komunikat w znaczniku noscript

<noscript>
Do poprawnego oglądania tej strony, należy włączyć obsługę JavaScript!
</noscript>

Plik z kodem JavaScriptu

Jeżeli mamy zamiar umieścić kod JavaScript znadujący się w osobnym pliku, należy użyć składni:

<script src="funkcje.js" type="text/javascript" language="JavaScript"></script>

Warunkiem zadziałania powyższego kodu, jest to, że istnieje plik "funkcje.js".

Istnieje również możliwość umieszczania w dokumencie dowolnie wielu skryptów JavaScript, na przykład:

<script type="text/javascript" language="JavaScript">
//<![CDATA[
...
Treść skryptu JavaScript;
...
//]]>
</script>
<script src="funkcje1.js" type="text/javascript" language="JavaScript"></script>
<script src="funkcje2.js" type="text/javascript" language="JavaScript"></script>
<script type="text/javascript" language="JavaScript">
//<![CDATA[
...
Treść skryptu JavaScript;
...
//]]>
</script>

Umieszczanie Javascriptu w dokumencie XHTML

Tak wygląda osadzanie kodu JavaScript w dokumencie XHTML:

<!DOCTYPE html 
	PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="description" content="Opis strony">
<meta name="author" content="Administrator">
<meta name="keywords" content="JavaScript">
<title>Jakiś tytuł</title>
<script src="funkcje.js" type="text/javascript" language="JavaScript"></script>
<script type="text/javascript" language="JavaScript">
//<![CDATA[
...
Treść skryptu JavaScript;
...
//]]>
</script>
<noscript>
Do poprawnego oglądania tej strony, należy włączyć obsługę JavaScript!
</noscript>
</head>
<body>
<h1>Jakiś tytuł</h1>
<p>Jakaś treść</p>
</body>
</html>

« Wikipedysta:Savix/Pierwszy program

Spis treści

Wikipedysta:Savix/Skryptozakładki »