ЦиклFor

For - это самый простой и наглядный цикл в JavaScript. For - это цикл с параметром, который принято называть счётчик. Счётчик устанавливается для того, чтобы цикл сделал определённое количество итераций(иными словами - исполнил те команды, которые мы ему задали столько разов, сколько мы скажем в счётчике). Это и является основным его недостатком - нужно наперёд знать, сколько итераций нам нужно, чтобы добиться желаемого результата.

Давайте рассмотрим синтаксис и пример цикла for:

for ([а]; [b]; [c])

{

//между этими скобками нужно написать команды цикла

}

На место [а] можно записать не только начальное значение счётчика, но и выражение (включая и оператор присваивания) или же объявить новую переменную. В этом условии можно объявлять новую счётчик-переменную при помощи оператора var. Эта переменная не может быть локальной переменной самого цикла, она видна, и её можно использовать во всей области "видимости".

[b] - это выражение, которое будет вычисляться циклом между итерациями. Если оно верное(true), то цикл выполняет следующую итерацию, иначе - цикл заканчивается, управление программой переходит дальше, уже вне цикла, вызывая последующие за циклом операторы и команды.

[c] - это выражение, которое будет вычисляться циклом в конце завершения каждой итерации, перед проверкой второго условия - [b]. Обычно оно используется для увеличения(уменьшения) переменной-счетчика. Рассмотрим такие примеры цикла for:

//for сосчетчиком

for (vari = 0; i< 10; i++) {

n += i;

}

//бесконечный цикл с выходом изнутри

for(;;) {

...

If (какое-то условие) break;

}

Цикл while

While - это цикл, который будет выполнятся до тех пор, пока эго условие верно(true). Условие проверяется перед каждой итерацией. Рассмотрим синтаксис:

while (condition)

statement

Б13

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

Общий вид создания массива в JavaScript такой:

var name = new Array(value_1, value_2, ..., value_n);

Таким образом, переменная с именем "name" содержит в себе массив со значениями: value_1, value_2, ..., value_n. Обращаться к массиву надо так:

name[i];

То есть пишется имя массива, а в квадратных скобках указывается порядковый номер массива. Причём, нумерация начинается с нуля. То есть первый элемент имеет индекс 0.

Давайте создадим и выведем второй элемент массива.

vararr = new Array(3, 4, 0, true, "string");

document.write(arr[1]);

Запустив этот скрипт, у нас в окне браузера появится 4. Теперь давайте выведем весь массив в окно браузера:

for (i = 0; arr.length; i++)

document.write(arr[i]);

Для того, чтобы вывести весь массив можно воспользоваться циклом. Здесь мы перебираем переменную i от 0 до длины массива (arr.length - это свойство, которое содержит длину массива arr). Затем мы выводим элемент массива, указав переменную итерации - i.

Давайте теперь мы решим такую задачу: пользователь последовательно вводит 5 чисел, которые мы вводим в массив, а потом выводим его в окно браузера.

vararr = new Array();

for (i = 0; i< 5; i++)

arr[i] = prompt("Введите " + (i + 1) + "-оечисло");

for (i = 0; i<arr.length; i++)

document.write(arr[i]);

Вначале мы создаём переменную, которая отвечает за массив. Дальше мы в цикле запрашиваем у пользователя по очереди 5 чисел. Апотом в цикле выводим полученный массив в браузер.

Б14

Оператор if...else

Оператор if...else - это условный оператор, который выполняет первый набор утверждений, если значение condition истинно. В противном случае выполняет второй набор утверждений, заключенные в операторе else, если условие ложно. Если набор утверждений (statments), заключенные в фигурные скобки {} содержит один оператор, то скобки можно опустить. Условные операторы могут быть вложены друг в друга без ограничений.

if (condition) {

...statements...

}[else {

else

...statements...

}]

Примеры

Следующая функция преобразует значение минут текущего времени в двузначное число для использования в программе "Часы":

fanctionmakeMinutes() {

varminstring="";

var now = new Date();

var min = Date.getMinutes();

if (min<10) {

minstring+=":0"+min;}

else{

minstring+=":"+min;}

returnminstring

}

15 обработка событий в языке JavaScript

В javascript (или jscript, версии javascript фирмы microsoft) есть две особенности: первая - что в нем поддерживаются только функции, вторая - что этот язык понятен для всех броузеров. Самый привычный способ передачи события элементу - это объявление названия функции в теге элемента. Заметим, что нам нужно записать не просто "myclickcode", а "myclickcode()" для соответствия синтаксической конструкции javascript.

Существует еще один прием обозначения обрабатывающей событие функции в строке с идентификатором элемента и события. В этом случае название события и имя элемента разделяют точкой. Но при этом надо иметь в виду, что эти методы не являются общепринятыми для обработки событий.

Отмена действия события. Некоторые события, такие как onsubmit, позволяют управлять тем, как броузер поведет себя в ответ на них, возвращая контрольное значение. Рассмотрим пример с формой, содержащей единственное текстовое поле email, и кнопку submit

Здесь для поиска символа @ в строке, введенной пользователем в форме, используется функция "indexof()". Если в строке нет такого символа, функция возвратит значение -1. В этом случае подразумевается, что это не может быть корректный e-mail. Об этом выдается сообщение, и отправка отменяется передачей значения false. Нами было использовано ключевое слово return в атрибуте элемента onsubmit, так что результат возвращается в ту часть броузера, которая занимается отправкой. Вместо возвращения значения собственно функцией мы можем отменить действие, по умолчанию назначенное для данного события, с помощью свойства returnvalue объекта event.

Одним из главных, но далеко не единственным, назначений сценариев в HTML-документе является обработка событий, таких как щелчок кнопкой мыши на элементе документа, помещение указателя мыши на элемент, перемещение указателя с элемента, нажатие клавиши и т. п. Большинство тегов HTML имеют специальные атрибуты, определяющие события, на которые могут отреагировать соответствующие элементы. Список всех допустимых событий довольно обширен и рассчитан практически на все случаи жизни. События называются довольно просто, особенно если вы знаете английский язык. Например, щелчок левой кнопкой мыши - onclick; изменение в поле ввода данных — onchange; событие onmouseover происходит, когда указатель мыши помещается на элемент HTML-документа. Список событий мы рассмотрим позже. Значением таких атрибутов-событий в тегах HTML является строка, содержащая сценарий, выполняющий роль обработчика события

Определение функции myfunc() должно находиться в одном из контейнеров <script>,либо в файле, который должен быть вставлен в HTML-код документа с помощью тега <script>.

Для одного и того же элемента можно определить несколько событий, на которые он будет реагировать. Другими словами, для одного и того же тега можно указать несколько атрибутов-событий. Имена этих атрибутов, как и других, можно писать в любом регистре. Порядок следования атрибутов не имеет значения. Итак, значением атрибута-события, как уже отмечалось, является код сценария, заключенный в кавычки. Этот сценарий называют также обработчиком события. В приведенном выше примере обработчиком события onclick является функция myfunc(). Если обработчик события содержит несколько выражений, то они разделяются точкой с запятой.

16 Назначение-, Спецификация CSS (Cascading Style Sheets) позволяет остаться в рамках декларативного характера разметки страницы и полностью контролировать форму представления элементов HTML-разметки.

Каскадные таблицы стилей призваны разрешить противоречие между точностью определения размеров картинок и приложений, с одной стороны, и точностью определения размеров блоков текста и его начертания — с другой.

Таблицы стилей также позволяют определить цвет и начертание текстового фрагмента, изменять эти параметры внутри текстового блока, выполнять выравнивание текстового блока относительно других блоков и компонентов страницы.

Наличие подобных возможностей позволяет говорить о CSS как о средстве разделения логической структуры документа и формы его представления. Логическая структура документа определяется элементами HTML-разметки, в то время как форма представления каждого из этих элементов задается CSS-описателем элемента.

CSS позволяет полностью переопределить форму представления элемента разметки по умолчанию. Например, <I>...</I> определяет отображение текста курсивом:

<I>Отобразим текст курсивом</I>

Практическое значение CSS для Web-инжиниринга (совокупности технологий разработки и сопровождения Web-узлов) заключается в том, что процесс создания узла можно формализовать и представить в виде последовательности действий:

необходимо определиться с номенклатурой страниц, т.е. все страницы проектируемого Web-узла разбить на типы, например домашняя страница, навигационные страницы, информационные страницы, коммуникационные страницы и т.п. У каждого узла этот перечень может быть свой;

• для каждого типа страниц требуется разработать определенную логическую структуру (стандартный набор компонентов страницы);

• следует создать навигационную карту узла и форму ее реализации на страницах;

• для каждого стандартного компонента страницы нужно разработать стиль его отображения (CSS-описатель);

• теперь остается только рисовать картинки, создавать анимацию, писать программы, вручную вводить текст и графику или генерировать содержимое страниц автоматически при обращении к ним.

Объяснив таким образом роль и назначение CSS среди многообразия Web-технологий, мы переходим непосредственно к обсуждению применения каскадных таблиц стилей.

Способы применения -Под способами применения CSS мы в данном разделе понимаем форму декларирования стиля на HTML-странице и форму связывания описания стиля отображения элемента разметки с самим элементом. Речь идет о том, где и в какой форме автор страницы (или дизайнер) описывает стиль, и как и в какой форме на него ссылается.

Итак, различают четыре способа применения стилей:

• переопределение стиля в элементе разметки;

• размещение описания стиля в заголовке документа в элементе STYLE;

• размещение ссылки на внешнее описание через элемент LINK;

• импорт описания стиля в документ.

Описание CSS (Cascading Style Sheets) – Каскадные таблицы стилей.

Здесь основным понятием является стиль – т. е. набор правил оформления и форматирования, который может быть применен к различным элементам страницы. В стандартном HTML для присвоения какому-либо элементу определенных свойств (таких, как цвет, размер, положение на странице и т. п.) приходилось каждый раз описывать эти свойства, даже если на одной страничке должны располагаться 10 или 110 таких элементов, ничуть не отличающихся один от другого. Вы должны были десять или сто десять раз вставить один и тот же кусок HTML-кода в страничку, увеличивая размер файла и время загрузки на компьютер просматривающего ее пользователя.

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

Более того, вы можете сохранить описание стиля не в тексте вашей странички, а в отдельном файле – это позволит использовать описание стиля на любом количестве Web-страниц, а также изменить оформление любого количества страниц, исправив лишь описание стиля в одном (отдельном) файле.