Вы здесь: Главная » JavaScript » Добавление скриптов на страницу. Диалоговое окно alert

Добавление скриптов на страницу. Диалоговое окно alert

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

Делается это предельно просто для тех, кто знаком с html - а знание этого языка разметки для использования JS (т.е. JavaScript) абсолютно необходимо, равно, как и знание CSS, т.к. JavaScript работает именно с html-кодом страницы и зачастую применяет к нему ряд правил CSS, как явно, так и с использованием классов.

Добавление скриптов на страницу

Выполняется с помощью тега <script> либо в блоке <head>, т.е. заголовочной части страницы, либо внутри тега <body>, т.е. основной части html-документа. Например,

Раньше, т.е. во времена HTML4 к тегу <script> дописывали обязательный атрибут text="javascript". Но в HTML5 он перестал быть нужным, т.к. никакими другими скриптами обычно на страницах не пользуются. Поэтому, если вы работаете в спецификации HTML5 (а она уже стала стандартом де-факто в Интернете), то смело опускайте этот атрибут.

Что касается размещения скриптов, то в заголовочной части страницы (блок <head>) обычно размещают скрипты, требующие более долгой загрузки, например, библиотеки типа jQuery  или Modernizr  или те, которые используются в учебных целях. Но чаще сейчас теги <script></script> размещают перед закрывающимся тегом <body>. Связано это с тем, что весь html-документ, с которым обычно работает JS, уже загрузился, и любые его элементы доступны для использования их в коде.

Чаще всего скрипты, как и css-форматирование, выносят в отдельные js-файлы, т.е. текстовые по сути файлы с расширением .js, в которых может быть записан только код на JavaScript, и ничего более. В этом случае у тега <script> появляется атрибут src, в котором записывается путь к js-файлу, аналогично тому, как в теге <link> атрибут href содержит путь к css-файлу.

Важно: в этом случае между тегами <script></script> не должно быть никакого кода!

В каждом из файлов может находится свой код, который управляет разными процессами. Чаще всего для всех js-файлов проекта, или сайта, создают папку js, из которой на разные страницы подключают разный код.

Комментарии в JavaScript

Существуют однострочные и многострочные комментарии в JavaScript:

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

Все, что помещено между комментариями, НЕ выполняется как код, т.е. пропускается интерпретатором браузера.

Диалоговое окно alert

alert() - это метод объекта window, отвечающего за все окно браузера, которое позволяет наладить простейший диалог  с пользователем. В этом диалоговом окне можно вывести некое сообщение (в первом примере таким сообщением было "Hello world"), значение переменной или выражения. Например:

Если нужно сформировать сложную строку из значений переменных, текста и выражения, то для "склеивания" (или по-другому, конкатенации) строки из разных элементов, нужно использовать оператор сложения, т.е. знак  "+":

Обратите внимание на то, что в первых двух строчках для вычисления суммы и разности использованы скобки. Сделано это для того, чтобы поменять последовательность выполнения операций: если бы скок не было, строки бы "склеились" и получилось вот что:

Почему получились такие значения и что такое NaN можно прочитать в статье "Переменные в JavaScript".

7 комментариев

  1. Все понятно. Спасибо.

  2. А разве сейчас часто применяют это окно?

  3. Боялся учить JavaScript.
    Прочитал статью, попробовал - все получилось. Спасибо!

  4. А как диалоговое окно у вас появляется при нажатии на кнопку?
    Нигде ведь это не написано.

  5. Хорошо, но мало. Это начала JavaScript для новичков.
    Хотелось бы новых статей в этой области, а то уже давно ничего не появлялось у вас по JS.

  6. У меня получилось! Ура! JavaScript сдвинулся с мертвой точки.
    Давайте еще что-нибудь простое, чтобы я смогла сделать!

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *