JavaScript для начинающих | Введение Зачем вообще использовать какие-то скрипты на стороне пользователя? Ключевое слово здесь — обработка событий. Таким событием может стать, например, клик по кнопке в форме отправки данных. Для этого предусмотрены специальные атрибуты, начинающиеся с on. Примеры таких атрибутов: onclick — одиночный щелчок мышью; onmouseover — размещение курсора мыши в области, которую занимает какой-либо элемент страницы; onfocus — выделение (фокусировка) элемента. Например, поля формы, куда установлен курсор. Окей, скажете вы, а зачем использовать какой-то JavaScript для обработки той же формы? Есть же php для этого. Заполнил, что требуют, и отправил себе с миром. Все верно, JavaScript не обрабатывает данные, это делает php на удаленном сервере. Но что если пользователь не все заполнил? Если пропустил обязательные поля, помеченные звездочкой *? Что тогда? Тогда с сервера к нему прилетит новая страница, на которой будет написано, какой он лох. Принципиальная разница тут вот в чем: без использования JavaScript при отправке формы запрос будет в любом случае отправлен на удаленный сервер, даже если форма заполнена неправильно или не полностью. И от сервера будет получен ответ с ошибкой. Пользователю придется все вводить заново. И так каждый раз. А если применить JavaScript, то страница с формой не будет отправлена на сервер до тех пор, пока пользователь не введет правильные данные. То есть, скрипт, как говорится, «не отходя от кассы», прямо в браузере пользователя проверит форму и выдаст сообщение в случае неправильного или недостаточного ее заполнения. Здесь он выступает как контролирующий орган. Согласитесь, что это гораздо удобнее, занимает меньше времени и, безусловно, съедает меньше трафика. А в случае с мобильным подключением к сайту это тем более существенно. Таким образом, сценарии JavaScript — это удобные помощники, которые не только проверяют введенные данные, но и выполняют еще массу полезных действий на стороне пользователя. Взять, к примеру, те же выпадающие списки меню или сворачиваемые окна, всевозможные слайдеры и эффектные галереи картинок, подсветка активных полей формы или всплывающие подсказки на страницах сайта и многое другое. Продвинутый читатель скажет: « — Ха! Так это же все можно сделать и на чистом CSS3 без всяких скриптов!» Согласен, кроме слова «все». Все да не все. Всякие свистелки и перделки можно и на чистом CSS3 сотворить, но проверить правильность заполнения формы CSS никак не может. А кроме этого существует еще тысячи способов использовать скрипты JavaScript для более серьезных вещей. Иначе умные люди не стали бы впихивать JavaScript в тот же Bootstrap или создавать мегаполезную библиотеку скриптов jQuery.
JavaScript для всех
Зачем нужен JavaScript?
JavaScript для начинающих | Введение
Зачем вообще использовать какие-то скрипты на стороне пользователя? Ключевое слово здесь — обработка событий. Таким событием может стать, например, клик по кнопке в форме отправки данных. Для этого предусмотрены специальные атрибуты, начинающиеся с on.
Примеры таких атрибутов:
onclick — одиночный щелчок мышью;
onmouseover — размещение курсора мыши в области, которую занимает какой-либо элемент страницы;
onfocus — выделение (фокусировка) элемента. Например, поля формы, куда установлен курсор.
Окей, скажете вы, а зачем использовать какой-то JavaScript для обработки той же формы? Есть же php для этого. Заполнил, что требуют, и отправил себе с миром.
Все верно, JavaScript не обрабатывает данные, это делает php на удаленном сервере.
Но что если пользователь не все заполнил? Если пропустил обязательные поля, помеченные звездочкой *? Что тогда? Тогда с сервера к нему прилетит новая страница, на которой будет написано, какой он лох.
Принципиальная разница тут вот в чем: без использования JavaScript при отправке формы запрос будет в любом случае отправлен на удаленный сервер, даже если форма заполнена неправильно или не полностью. И от сервера будет получен ответ с ошибкой. Пользователю придется все вводить заново. И так каждый раз. А если применить JavaScript, то страница с формой не будет отправлена на сервер до тех пор, пока пользователь не введет правильные данные.
То есть, скрипт, как говорится, «не отходя от кассы», прямо в браузере пользователя проверит форму и выдаст сообщение в случае неправильного или недостаточного ее заполнения. Здесь он выступает как контролирующий орган.
Согласитесь, что это гораздо удобнее, занимает меньше времени и, безусловно, съедает меньше трафика. А в случае с мобильным подключением к сайту это тем более существенно.
Таким образом, сценарии JavaScript — это удобные помощники, которые не только проверяют введенные данные, но и выполняют еще массу полезных действий на стороне пользователя. Взять, к примеру, те же выпадающие списки меню или сворачиваемые окна, всевозможные слайдеры и эффектные галереи картинок, подсветка активных полей формы или всплывающие подсказки на страницах сайта и многое другое.
Продвинутый читатель скажет: « — Ха! Так это же все можно сделать и на чистом CSS3 без всяких скриптов!»
Согласен, кроме слова «все». Все да не все. Всякие свистелки и перделки можно и на чистом CSS3 сотворить, но проверить правильность заполнения формы CSS никак не может. А кроме этого существует еще тысячи способов использовать скрипты JavaScript для более серьезных вещей. Иначе умные люди не стали бы впихивать JavaScript в тот же Bootstrap или создавать мегаполезную библиотеку скриптов jQuery.