Przejdź do treści

Wstęp do JavaScript i ECMAScript

Co to jest język ECMAScript, JavaScript, ActionScript, node.js? Jak wstawia się skrypty na stronie WWW?

Różnice między ECMAScript a JavaScript

Czym różni się ECMAScript od JavaScript, ActionScript i node.js?

ECMAScript jest językiem skryptowym ogólnego przeznaczenia. W czystym ECMAScript nie da się jednak napisać żadnego rzeczywistego programu, ponieważ definiuje on jedynie składnię języka, podstawowe typy danych oraz ogólne funkcje biblioteczne. Brakuje natomiast API, dzięki któremu użytkownik mógłby wprowadzić dane do programu, GUI pozwalającego sterować aplikacją oraz sposobu na zaprezentowanie danych wyjściowych.

Po co zatem powstał taki język programowania, w którym nie można napisać żadnego programu? :-) Istnieje szereg praktycznych języków, które implementują ECMAScript, ale dodatkowo zapewniają brakujące mu funkcje:

  • JavaScript - dynamiczne efekty na stronach WWW i rozbudowane aplikacje web (w tym gry online)
  • ActionScript - programowanie animacji wektorowych i gier online w technologii Flash
  • node.js - język działający po stronie serwera (podobnie jak np. PHP)

W tych językach jak najbardziej można tworzyć rzeczywiście działające aplikacje, a wszystkie one opierają się właśnie na ECMAScript. Dlatego zachęcam wszystkich do nauki języka, o którym śmiało można powiedzieć, że to właśnie w nim zaprogramowana jest sieć WWW.

Bardzo duża objętość tematu nie daje możliwości szybkiego opracowania całości kursu JS, tak aby był w pełni kompletny. Jeżeli jednak ta tematyka będzie się cieszyć dużym zainteresowaniem wśród czytelników, na pewno kurs będzie stale uzupełniany o nowe części.

Źródła

Jak osadzić skrypt JavaScript na stronie?

W jaki sposób wstawić kod JavaScript na stronie internetowej?

Wstęp

Aby osadzić kod JavaScript na stronie internetowej, należy posłużyć się znacznikiem SCRIPT. Sam sposób osadzenia będzie się nieco różnił w zależności do wersji użytego języka (X)HTML (patrz poniżej).

HTML5

W języku HTML5 można to zrobić następująco:

<script>
/* Tutaj umieść kod skryptu. */
</script>

Jeżeli ten sam skrypt chcemy osadzić na kilku podstronach, możemy zapisać go w pliku z rozszerzeniem *.js i potem wstawić do niego odwołanie:

<script src="plik.js"></script>

Dodatkowo w tym przypadku do znacznika SCRIPT można dodać atrybut logiczny async, dzięki któremu przeglądarka wczyta w tle plik z kodem skryptu (który może być czasem sporych rozmiarów), pozwalając w tym czasie użytkownikowi normalnie rozpocząć czytania treści strony, na nic nie czekając.

<script async src="plik.js"></script>

Podobnie działa atrybut defer, jednak wtedy przeglądarka rozpoczyna wczytywanie skryptu dopiero po załadowaniu pełnego kodu HTML dokumentu. Może to potrwać nieco dłużej niż w przypadku użycia atrybutu async.

XHTML

W języku XHTML skrypty osadzamy następująco:

<script type="text/javascript">
// <![CDATA[
/* Tutaj umieść kod skryptu. */
// ]]>
</script>

oraz

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

W przypadku XHTML 1 możliwe jest dodatkowo użycie jedynie atrybutu defer:

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

W XHTML5 można również użyć async="async".

HTML 4.01

Osadzenie skryptu w języku HTML 4.01 wygląda tak:

<script type="text/javascript">
<--
/* Tutaj umieść kod skryptu. */
//-->
</script>

oraz

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

Możemy również użyć dodatkowego atrybutu defer:

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

Przeglądarki


Chrome
Firefox
Edge
Opera
Safari
<script>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		3
2007-10-26
<script async>1
2008-12-11		3.6
2010-01-21		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<script defer>1
2008-12-11		3.5
2009-06-30		12
2015-07-29		15
2013-07-02		3
2007-10-26
<script src>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<script type>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
Facebook