Определение JavaScript
JavaScript (ДжаваСкрипт) - это мультиплатформенный, объектно-ориентированный, сценарный язык программирования, созданный в 1995 году разработчиком Брендоном Айком. Язык соответствует спецификации ECMAScript (как и другие скриптовые языки как например: JScript, ActionScript).
Изначально язык назывался LiveScript, и в последующем был переименован в JavaScript. JS ориентирован на веб и имеет огромную популярность среди frontend - разработчиков т.к. является единственным языком, который выполняется в браузере. JS применяется преимущественно в браузере на стороне клиента, однако существуют другие технологии (Node.js), основанные на JS выполняемые не только на клиенте, но и на стороне сервера.
Особенности JavaScript
JavaScript содержит стандартную библиотеку объектов, таких как Array, Date и Math, а также включает универсальный набор элементов языка - операторы, структуры и инструкции.
JavaScript может быть расширен для выполнения различных задач путем добавления дополнительных объектов, например:
- Клиентский JavaScript - расширяет возможности языка, добавляя в него объекты для управления браузером и его объектной моделью DOM. Например, клиенсткий JavaScript позволяет веб-приложению изменять содержимое HTML тегов и реагировать на действия пользователя, такие как нажатия кнопки мыши, ввод данных в поля формы, скроллинг страницы и многое другое.
- Серверный JavaScript - расширяет возможности языка, добавляя в него объекты, необходимые для выполнения JavaScript на сервере. Например, серверный JavaScript позволяет веб-приложению взаимодействовать с базой данных, обеспечивать непрерывность потока данных внутри приложения или выполнять манипуляции с файлами на сервере.
JavaScript и Java
JavaScript и Java не одно и то же, они являются разными языками программирования. JavaScript и Java в некоторых моментах похожи, однако на фундаментальном уровне - совершенно разные. JavaScript наследует большинство синтаксических особенностей и правила именования из языка Java, что послужило причиной переименования LiveScript в JavaScript.
Подключение JavaScript
Для того, чтобы начать использовать JS, необходимо вставить код внутрь HTML файла с помощью специального тега <script>Ваш код JavaScript</script>.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <tittle>Использование JavaScript</tittle> </head> <body> <!-- Начало использование кода JavaScript --> <script> var msg = "Мир!" alert("Привет, " + msg ); //Вывод диалогового окна с надписью - "Привет, Мир!" </script> <!-- Конец использования кода JavaScript --> </body> </html> |
Однако при большом количестве строк, для сохранения порядка и эстетичности в коде, JavaScript лучше хранить в отдельных файлах с расширением .js и подключить и в файле HTML, где они будут использоваться, с помощью атрибута src.
|
1 2 3 4 5 6 7 8 9 10 |
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <tittle>Использование JavaScript</tittle> <script src="js/main.js"></script> </head> <body> </body> </html> |
Размещать код JavaScript можно в любой части HTML страницы, в пределах тегов <head></head> и <body></body>, однако хорошей практикой будет размещение кода JavaScript в конце файла перед закрывающим тегом </body>, таким образом Вы не заставите пользователей с медленным интернетом ждать загрузки подключенных JS файлов и почти сразу предоставить им внешний вид самой страницы.
Применение JavaScript
JavaScript необходим для придания сайту большей динамичности и интерактивности, а также для изменения структуры страницы в реальном времени. Так, например, если Вы хотите, чтобы после того, как произошло какое - либо событие (пользователь нажал на кнопку), появилось всплывающее окно, то Вы сможете реализовать данную функцию с помощью JS.
Также JS часто используется для написания веб - приложений, например, налоговый калькулятор, игра, обучающие программы и многое другое.
В большинстве случаев JS используется на стороне клиента для манипулирования DOM-элементами страницы (HTML - элементы такие как, div, p, a, span ...). С помощью JS можно создавать, удалять, скрывать, отображать, изменять почти любой DOM-элемент на странице.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <tittle>Пример использования JS</tittle> </head> <body> <div id="product"> <p>Электробритва</p> <button id="buyBtn">Купить</button> </div> <div id="thanks"> <p>Спасибо за покупку!</p> </div> <script> var product = document.getElementById("product"); //Получаем доступ к элементу с id="product" и сохраняем его в переменную product var buyBtn = document.getElementById("buyBtn"); //Получаем доступ к элементу с id="buyBtn"и сохраняем его в переменную buyBtn var thanks = document.getElementById("thanks"); //Получаем доступ к элементу с id="thanks" и сохраняем его в переменную thanks thanks.style.display = "none"; //Первоначальное сокрытие блока с благодарностью buyBtn.onclick = function(){ //Вызов данной функции произойдет после нажатия на кнопку "Купить" product.style.display = "none"; //Прячем блок с товаром thanks.style.display = "block"; //Показываем блок с благодарностью за покупку } </script> </body> </html> |