Чтобы прочесть данную статью, нужно знать HTML и CSS.
Программа записанная на языке JavaScript состоит из команд. Команды исполняются веб-браузером и могут управлять HTML элементами и CSS стилями на веб-странице.
Пример 1
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <title>JavaScript</title> </head> <body> <script> alert('Привет, мир!'); </script> </body> </html> |
В данном примере программа на JavaScript записана в HTML элементе “script”. Она состоит из одной команды “alert()”. Эта команда выводит в отдельном окне то, что записано внутри её скобок. В данном случае, в скобках указана строка ‘Привет, мир!’. В JavaScript строки записываются в одинарных или двойных кавычках. В примере выводится окно со строкой “Привет, мир!”.
Пример 2
|
1 2 3 4 5 6 7 8 9 10 |
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <title>JavaScript</title> <script src="main.js"></script> </head> <body> </body> </html> |
|
1 |
alert('Привет, мир!'); |
Результат такой же как в примере 1.
Программы на JavaScript записываются в файлах с расширением “js”. Программа из данного примера записана в файл “main.js” и вызывается из веб-страницы “index.html” с помощью элемента “script”. Адрес файла с программой указывается в атрибуте “src” этого элемента.
HTML элемент “script” может быть записан в элементе “head” или “body”. Если “script” помещён до каких-то HTML элементов, то он не имеет к ним доступа.
Пример 3
|
1 2 3 4 5 6 7 8 9 10 11 |
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <title>JavaScript</title> </head> <body> <input type="button" value="Нажать" onclick="alert('Привет, мир!');"> </body> </html> |
При нажатии на кнопку “Нажать” получается результат как в примере 1.
Значение “button” атрибута “type” у элемента “input” задаёт создание кнопки. Значение атрибута “onclick” состоит из команд JavaScript, которые выполняются при нажатии мышью.
Пример 4
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <title>JavaScript</title> </head> <body> <script> alert('Привет, мир!');// Это однострочный комментарий /* Это многострочный комментарий на трёх строках */ </script> </body> </html> |
Результат такой же как в примере 1.
В JavaScript после символов “//” располагаются поясняющий текст на одной строке – однострочный комментарий. Комментарии игнорируются в JavaScript и не исполняются как команды. Между символами “/*” и “*/”, которые могут быть на разных строках, тоже располагается поясняющий текст – многострочный комментарий.
