Jak osadzić skrypt JavaScript na stronie?

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