Добавление JavaScript в HTML

JavaScript можно добавить практически в любое место HTML документа. Но существуют следующие наиболее предпочтительные способы, которые используются чаще всего:

в средине тега <head>;
в средине тега <body>;
в тегах <head> и <body>;
внешний JavaScript файл с ссылкой на него в средине тега <head>.

1. Тег <script>

В HTML код JavaScript должен быть вставлен в средину тега <script>. Например:

2. JavaScript в теге <head>

Если вы хотите, чтобы сценарий запустился после какого-то события, например, когда пользователь щелкнет на кнопку, JS нужно размещать в теге <head>. Например:

Это даст следующий результат:

3. JavaScript в теге <body>

Если вам нужен сценарий, который должен запускаться при загрузке страницы, то JS следует размещать в теге <body>. Например:

<html>
<head>
</head>
<body>
<script type="text/javascript">

</script>
<p>Результат JS на следующей строчке</p>
</body>
</html>

4. JavaScript в тегах <head> и <body>

Вы можете разместить код JavaScript в тегах <head> и <body>. В целом это будет выглядеть следующим образом:

Результат будет таким:

5. JavaScript во внешнем файле

Как только вы начнете работать с JavaScript более интенсивно, вы вероятно обнаружите, что бывают случаи, когда вы повторно используете идентичный код JavaScript на нескольких страницах сайта.

Вы не ограничены, чтобы быть поддержание идентичный код в несколько файлов HTML. Тег <script> обеспечивает механизм, позволяющий хранить JS во внешнем файле, а затем включать его в свои HTML страницы.

Вот пример, как можно включить внешний файл JavaScript в HTML-код с помощью тега <script> и его атрибута "src":

Или еще вариант:

Чтобы использовать внешний источник JS, необходимо написать все JavaScript коды в простом текстовом файле с расширением ".js", а затем включить этот файл, как показано выше.