Основы JavaScript. Язык программирования JavaScript (Ява Скрипт)
Современные браузеры в обязательном порядке имеют поддержку языка JavaScript.
Команды JavaScript добавляются на веб-страницы с помощью тега , причём исполняемый скрипт нужно вносить в окне Текст CMS WordPress. Контейнеров в одном документе может быть сколько угодно. Атрибут «type=’text/javascript’» указывать необязательно, так как по умолчанию стоит javascript.
Вот пример:
document
.
write
(«Вывод текста стандартной командой JavaScript.»
);
Атрибут type тега сообщает браузеру о том, команды какого скриптового языка встроены далее до закрывающего тега .
Осваивая язык JavaScript, нужно прежде всего освоить комментарии, которые на первых порах использования языка следует использовать особенно часто.
JavaScript допускает короткие комментарии — комментарии, длина которых не превышает длину строки. Всё, что находится после двух символов // до конца строки, будет являться коротким комментарием. Вот два примера коротких комментариев:
// 1. Команда ниже отображает Абзац, выводимый жирным шрифтом
document
.
write
(«»
);
document . write ( Hello, World! ); // 2. Вывод курсивом строки Hello, World!
Кроме того, JavaScript допускает многострочные комментарии — комментарии, которые распространяются на несколько строк. Вот пример такого комментария:
/*
Первая команда выводит абзац жирным шрифтом,
а вторая команда выводит абзац курсивом
*/
document
.
write
(«
Абзац, выводимый жирным шрифтом.
» ); document . write («Абзац, выводимый курсивом.
» );Невозможно описать все возможности языка JavaScript на одной странице, на ней буду записывать только наиболее существенные, по моему мнению, особенности языка.
Скрипт этого языка можно как внедрять непосредственно в HTML-код страницы, так и выносить в файл, который может вызываться разными страницами. Вот пример вызова файла со скриптом:
Если указан атрибут src=»… «, то содержимое тега игнорируется, то есть в одном теге script нельзя одновременно подключить внешний скрипт и указать код, поэтому нужно выбирать: script либо содержит src, либо содержит код. При необходимости просто код вносим в другой script.
Кстати, WordPress версии 4.0 не признаёт код JavaScript в HTML-коде страниц и портит его, пряча код JavaScript за
Объявление массивов
MyArray = new Array(365);
Массивы реализованы так, что только определенные (имеющие не пустое значение) элементы будут использовать память, они "разряжают массивы". Если мы зададим множество myАггау = "чего-то там" и myArray = "что-то там еще ", то мы использовали место только для этих двух элементов.
Объекты
JavaScript имеет несколько видов встроенных объектов, а именно Object, Array, String, Number, Boolean, Function, Date and Math. Другие объекты принадлежат объектам DOM (окна, формы, ссылки и т.д.).
Определив функции конструктора можно определить объекты. JavaScript является объектно-ориентированный язык основанным на прототипах. Можно добавить дополнительные свойства и методы к отдельным объектам после того как они были созданы. Для этого для всех экземпляров определенного одного типа объекта можно использовать прототип-заявление.
Пример: Создание объекта
// Функция-конструктор
Function MyObject(attributeA, attributeB) {
this.attributeA = attributeA
this.attributeB = attributeB
}
// Создать объект
obj = new MyObject("red", 1000)
/ / Доступ к атрибуту объекта
alert(obj.attributeA)
/ / Доступ атрибут с ассоциативный обозначения массива
alert(obj["attributeA"])
Иерархия объектов может быть воспроизведена и в JavaScript. Например:
Function Base() { this.Override = _Override; this.BaseFunction = _BaseFunction; function _Override() { alert("Base::Override()"); } function _BaseFunction() { alert("Base::BaseFunction()"); } } function Derive() { this.Override = _Override; function _Override() { alert("Derive::Override()"); } } Derive.prototype = new Base(); d = new Derive(); d.Override(); d.BaseFunction();
В результате получим на экране: Derive::Override() Base::BaseFunction()
Управляющие инструкции
If ... else
if (condition) {
statements
}
Циклы
while (condition) {
statements
}
Do ... while
do {
statements
} while (condition);
For loop
for (; ; ) {
statements
}
Цикл For ... in
Этот цикл проходит по всем свойствам объекта (или элемента в массиве)
for (variable in object) {
statement
}
Оператор выбора
switch (expression) {
case label1:
statements;
break;
case label2:
statements;
break;
default:
statements;
}
Функции
Заключается тело функции в {тело может быть пустым}, а список аругментов указывается внутри () идущих после имени функции. Функции могут возвращать значение, после выполнения.
Function(arg1, arg2, arg3) { statements; return expression; }
В качестве примера разберем функцию, основанную на алгоритме поиска наибольшего общего делителя Евклида:
Function gcd(a, b) { while (a != b) { if (a > b) { a = a - b; } else { b = b - a; } } return a; }
Количество аргументов при вызове данной функции не должны обязательно предоставлять столько аргументов, сколько указано при объявлении функции. В функции аргументы могут также быть доступны через массив аргументов.
Каждая функция - экземпляр функции, базового типа объекта. Функции могут быть созданы и назначены как и любые другие объекты:
Var myFunc1 = new Function("alert("Hello")"); var myFunc2 = myFunc1; myFunc2();
Результат на экране:
Взаимодействие с пользователем
Большинство взаимодействие с пользователем осуществляется с помощью HTML-форм, которые могут быть доступны через HTML DOM. Однако Есть также некоторые очень простые средства общения с пользователем:
Оповещение диалоговом окне
Подтвердите диалоговое окно
Строки диалогового окна
Строка состояния
Консоли
Текстовые элементы могут быть источником различных событий, которые могут вызвать действия, если обработчик события EMCAScript зарегистрирован. В HTML эти функции обработчика событий часто определяется как анонимные функции непосредственно в тегах HTML.
В этой статье мы расскажем, что такое JavaScript (Джава Скрипт), приведем примеры, поясним для чего он нужен в html коде. Дадим ответы на популярные вопросы вебмастеров.
1. Что такое JavaScript простыми словамиJavaScript (на русском "Джава Скрипт", сокращенно "JS") - язык программирования встраиваемый в HTML страницы с целью удобства общения с пользователем, обработки ошибок и создания динамичности странице в целом.
JavaScript является объектно-ориентированным и интерпретируемым языком. Является системно-независимым (работает на любых платформах). Зачастую JS код называют скриптами. Можно сказать, что этот язык "заточен" лишь для веб-программирования.
Синтаксис языка во многом напоминает Си и Java, семантически же язык гораздо ближе к Self, Smalltalk.
2. Задачи решаемые JavaScript- Проверку полей html форм (тег ) до того, как они передались на сервер
- Информационные сообщения с предупреждениями
- Эффекты для выделения главных элементов и частей страницы
- Оригинальные выпадающие меню
- Математические вычисления
Обычно с помощью JavaScript делают слайдеры . Можно также выводить контент через вывод на AJAX , это позволяет скрывать из html-кода ненужные или повторящиеся элементы страницы сайта. Изучать эти коды новичку не имеет смысла, т.к. они довольно сложные.
3. Как включить поддержку JavaScript в браузереВсе браузеры поддерживают JavaScript. По умолчанию Джава Скрипт уже должен быть включен в браузерах, если нет, то ниже представлены инструкции для различных браузерах по включению JS.
1. Включить JavaScript в Firefox 2. Включить JavaScript в Google Chrome"Настройка и управление Google Chrome" -> "Параметры" -> "Расширенные" -> "Личные данные (Настройки содержания)" -> "JavaScript:" Разрешить всем сайтам использовать JavaScript (рекомендуется) или запретить выполнение JavaScript на всех сайтах
3. Включить JavaScript в OperaНажать на клавишу F12 Выбрать пункт "Включить JavaScript"
4. Включить JavaScript в Internet Explorer"Сервис" -> "Свойства обозревателя" -> вкладка "Безопасность" -> выбираем зону "Интернет" -> кнопка "Другой" -> пункт "Сценарии" -> "Разрешить сценарии"
4. Пример: как вставить JavaScript в html страницуКод JavaScript вписывается прямо в html код страницы. Для его выделения используют специальные теги
код на javasriptАтрибут type="text/javascript" указывать не обязательно, но желательно.
Использовать <script> можно в заголовочных тегах , так и просто в теле страницы .
Писать html теги между открывающим и закрывающим тегом script запрещено. Это место только для кода на JavaScript.
Чтобы не дублировать один и тот же JavaScript на каждой странице его обычно выносят в отдельный файл с расширением ".js". Этот файл можно подключить в любом месте html-страницы.
4.1. Пример 1. Всплывающие сообщение Hello, WorldНиже представлен пример html код, который при загрузке страницы выводит всплывающее сообщение "Hello, World".
Hello, World на JavaScriptПример с Alert. Будет выведено всплывающие сообщение
alert ("Hello, World! ");Нажмите на ссылку:
Ссылка 4.2. Пример 2. Альтернатива с обработкой javascriptНиже представлен пример html кода с обработкой кода JavaScript с помощью идентификатора id.
Hello, World на JavaScript window.onload = function() { var linkWithAlert = document.getElementById ("check_link "); linkWithAlert.onclick = function() { return confirm ("Перейти по ссылке? "); }; };Нажмите на ссылку :
Ссылка 4.3. Пример 3. Смена цвета объекта при наведении курсораПри наведении курсора мышки на определенные области, они изменяют цвет. Делается это через JavaScript. Например
Код этого примера:
RED GREEN BLUEЭто лишь самые элементарные вещи на JavaScript. Его возможности довольно большие. Не даром в литературных магазинах по этому языку можно найти отдельные книги.
JavaScript — это один из языков программирования, который обычно используется для программного доступа к объектам приложений. Часто он встроен в браузер и необходим для того, что бы делать веб-страницы более функциональными. Соответственно, если JavaScript отключен по тем или иным причинам, то страница может не открываться вовсе или будет открываться, но с существенными ограничениями или ошибками. К примеру, может не показываться какой-то определенный текст. Поэтому если вы не знаете, как активировать этот язык в своем интернет-обозревателе, то вы обратились по адресу.
Mozilla Firefox- В верхнем меню выбираете раздел «Инструменты» — «Настройки».
- Перед вами открылось окно на вкладке «Основные». Необходимо выбрать вкладку «Содержимое».
- В верхней части окна вы увидите несколько пунктов, одним из которых будет называться «Использовать JavaScript» — поставьте галочку рядом с ним и нажмите кнопку ОК.
- Обновите страницу при помощи клавиши F5 на клавиатуре.
ВНИМАНИЕ! Это описание подходит исключительно для версии ниже 22 версии. Начиная с версии 23, JavaScript не требуется - опция включена по умолчанию.
Opera- В левом верхнем углу кликните по кнопке «Инструменты» — «Настройки» — «Общие настройки».
- Оказавшись в меню, перейдите на вкладку «Дополнительно» (она пятая по счету).
- В левом меню нажмите по ссылке «Содержимое» и рядом с пунктом «Использовать JavaScript» поставьте галочку.
- Нажмите ОК и обновите страницу.
- В правом верхнем углу находится кнопка, на которой вы увидите три полоски — нажмите на нее и выберите раздел «Настройки».
- Прокрутите страничку вниз до самого конца и кликните по «Показать дополнительные настройки».
- В разделе «Личные данные» вы увидите кнопку «Настройки контента», на которую требуется нажать.
- Открылось дополнительное окно. Найдите пункт «Разрешить всем сайтам использовать JavaScript (рекомендуется)» и нажмите кнопку ОК.
- Перезагрузите страницу в интернет-обозревателе.
- Открываем свойства обозревателя (это можно сделать как в самом браузере через меню, так и при помощи панели управления вашим компьютером).
- Открылось окно, необходимо перейти на вкладку «Безопасность».
- В нижней его части надо нажать на кнопку с надписью «Другой…».
- Открылся большой список. Необходимо дойти до раздела «Сценарии» и в подразделе «Активные скрипты» поставить галочку возле пункта «Включить».
- Нажимаете ОК, обновляете страничку.
- В меню находим раздел «Настройки».
- Открылось отдельное окно с несколькими вкладками, среди которых нужно открыть ту, что называется «Безопасность».
- Рядом с пунктом «Подключить JavaScript» ставим галочку и закрываем окно.
- Обновляем страничку путем нажатия на клавишу F5.
Необходимо отметить, что все версии наиболее известных и популярных браузеров на сегодняшний день обеспечивают поддержку JavaScript. Поддерживают они третью редакцию спецификации, а в Mozilla Firefox была даже предпринята попытка поддержки четвертой редакции. По-умолчанию практически на всех интернет-обозревателях JavaScript используется по умолчанию, а отключается он, как правило, самим пользователем.
Что же касается использования языка, то он необходим, например, в некоторых веб-приложениях, скриптах в обозревателях (речь идет об особых программах, которые позволяют форматировать страницы, автоматически заполнять формы, скрывать часть содержимого и так далее), а также в AJAX (подход к построению интерфейсов приложений, при котором обмен данными с сервером происходит в фоновом режиме, благодаря чему страница перезагружается не полностью, а работа самого приложения лишь ускоряется).