Как создать файл js

Обновлено: 21.11.2024

Включение JavaScript на вашу страницу – довольно простой процесс.

Во-первых, что такое JavaScript?

С сайта школ W3C:

  • JavaScript был разработан для добавления интерактивности HTML-страницам.
  • JavaScript – это язык сценариев.
  • Язык сценариев – это легкий язык программирования.
  • JavaScript обычно встраивается непосредственно в HTML-страницы.
  • JavaScript – это интерпретируемый язык (это означает, что скрипты выполняются без предварительной компиляции)
  • Каждый может использовать JavaScript без покупки лицензии

Включая JavaScript

Вы можете включить JavaScript в свой HTML двумя способами:

  • Написание кода в HTML
  • Включить его как ссылку на внешний файл

В большинстве случаев вы будете включать JavaScript как внешний файл.

Тег сценария

Тег — это то, что мы используем для включения нашего JavaScript. Он очень похож на тег, который вы уже использовали для включения файлов CSS.

Вот очень простой фрагмент кода JavaScript с использованием тега script. Этот JavaScript записывается непосредственно на нашу HTML-страницу. Он позвонит и уведомит окно, как только страница загрузится.

При использовании тега script мы всегда должны использовать имя атрибута и значение type="text/javascript" .

Использование тега script для включения внешнего файла JavaScript

Чтобы включить внешний файл JavaScript, мы можем использовать тег скрипта с атрибутом src. Вы уже использовали атрибут src при работе с изображениями. Значением атрибута src должен быть путь к вашему файлу JavaScript.

Этот тег script должен быть включен между тегами в HTML-документе.

Файлы JavaScript

  • Всегда заканчивайте расширением js
  • Включить только JavaScript

На веб-сайтах принято помещать все файлы JavaScript в папку с именем js, например:

Простая демонстрация включения JavaScript

Вот очень простая демонстрация того, как включить внешний файл JavaScript в HTML-страницу.

Другие JavaScript

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

Фреймворки JavaScript

Framework — это, по сути, библиотека кода для определенного языка. Как правило, фреймворк абстрагирует общие задачи и упрощает и ускоряет для дизайнеров и разработчиков написание своего конкретного кода. Фреймворки на самом деле ничего не делают сами по себе, они просто предоставляют людям более простую платформу для разработки.

Распространенные фреймворки JavaScript:

Из этих платформ JQuery в настоящее время является самой популярной. Кроме того, вы больше всего хотели бы встретить его в качестве модного слова.

Размеры файлов JavaScript

Многие файлы JavaScript могут быть довольно большими, что может замедлить загрузку вашей страницы. Популярные фреймворки обычно предлагают «уменьшенную» версию своего кода. Вы всегда должны использовать эту версию на своих страницах, потому что она будет иметь меньший размер файла.

В HTML код JavaScript вставляется между тегами .

Пример

В старых примерах JavaScript может использоваться атрибут типа: .
Атрибут type не требуется. JavaScript является языком сценариев по умолчанию в HTML.

Функции и события JavaScript

Функция JavaScript – это блок кода JavaScript, который может выполняться при "вызове".

Например, функцию можно вызвать, когда происходит событие, например, когда пользователь нажимает кнопку.

Вы узнаете гораздо больше о функциях и событиях в следующих главах.

JavaScript в или

Вы можете разместить любое количество скриптов в HTML-документе.

Сценарии можно размещать в разделе , или в разделе HTML-страницы, или в обоих случаях.

JavaScript в

В этом примере функция JavaScript размещена в разделе HTML-страницы.

Функция вызывается (вызывается) при нажатии кнопки:

Пример

Демонстрация JavaScript в Head

JavaScript в

В этом примере функция JavaScript размещена в разделе HTML-страницы.

Функция вызывается (вызывается) при нажатии кнопки:

Пример

Демонстрация JavaScript в теле