Лекция № Тема: «Основные элементы идеологии скриптового программирования»

Вид материала

Лекция

Содержание Script>: for Объектная модель браузера. FrameName . document. FormName 2. Доступ к значениям параметров (свойств) объекта TxtMessage = document.FormName.TxtName.value NAME, например для форм и их элементов, фреймов и пр., или параметр ID ID="myparag". Аналогично, через document. all FormName.TxtName.value = 'Вставляемый текст' "> Методы и функции WinName = window.open () WinName.document.write("Текст 1"); WinName.document.write("Текст 2") ; WinName.document.write("Текст 3")

Подобный материал:

• Лекция № Тема: «Методы и свойства», 168.5kb.
• Лекция 4 Тема 3 Технология программирования и основные этапы ее развития, 46.22kb.
• Лекция Языки и системы программирования. Структура данных, 436.98kb.
• "Основы идеологии Белорусского государства" Материалы для Лекции Мировоззрение и идеология., 2538.26kb.
• Лекция 3 Инструментальное по. Классификация языков программирования, 90.16kb.
• План лекций по курсу «применение компьютерных технологий в химии» лекция, 16.53kb.
• Тема: Введение в гидравлику Лекция, 328.7kb.
• Вопросы к экзамену по курсу экономико-математические методы и прикладные модели, 104.05kb.
• Лекция №1, 1780.7kb.
• Основы идеологии белорусского государства. Основные ориентиры Белорусской государственной, 81.17kb.

Лекция №

Тема: «Основные элементы идеологии скриптового программирования»

Вопросы темы:

1. Основные принципы работы со скриптами.
   
2. объектная модель браузера.
   
3. доступ к значениям параметров (свойств) объекта.
   
4. объекты и события.
   
5. методы и функции
   
6. переменные-макроподстановки
   

1. Основные принципы работы со скриптами.
   

Скрипт представляет собой исходный текст (листинг) программы на языке " onclick="return false">
При открытии htm-файла находящиеся в нем листинги скриптов обнаруживаются браузером и транслируются им в исполняемый код, соответствующий данному типу компьютера и операционной системы. Скрипты представляют собой программные модули, определяющие, какие действия должен совершить компьютер в ответ на указанное разработчиком Web-страницы действие пользователя (например, щелчок мышью на той или иной кнопке).

Исходный текст программы скрипта заключается в контейнер

, размещаемый в нутрии контейнера …. Листинг Java-скрипта также может содержаться в отдельном файле (это удобно, например, когда один и тот же скрипт используется на нескольких страницах: можно не повторять весь листинг на каждой из них, а лишь разместить обращение к требуемому «скриптовому файлу»).

.

Таких контейнеров, ссылающихся на разные скриптовые файлы, в одном и том же html-документе может быть и несколько, в том числе, когда каждый из них «отвечает» за какую-то конкретную ситуацию, происходящую для конкретного объекта Web-страницы. Для этого предназначены дополнительные параметры тэга < SCRIPT>: FOR (указывает имя объекта) и EVENT (указывает событие).









Не все браузеры (особенно это касается старых версий) способны корректно распознавать Скрипты и выделять их из html-текста, поэтому текст скриптов, как правило прячут в комментарии ( .

2. Объектная модель браузера.
   

Идеология работы со скриптами построена на нескольких основополагающих принципах:

1. Представление HTML-документа как совокупности вложенных друг в друга объектов («контейнеров»), образующих иерархическую структуру.
   

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

кнопка

При этом каждому компоненту HTML-документа с помощью параметра NAME присваивается собственное имя (идентификатор). Соответственно, для получения доступа к конкретному элементу необходимо указать в скрипте все его «уровни вложенности». Запись идентификаторов производится через десятичную точку, например:

Document.FormName.ButtonName.

Содержащаяся в окне браузера страница указывается здесь «общим» именем document, а для формы и кнопки указываются их индивидуальные имена (FormName и ButtonName). Это верно лишь при работе с текущим документом (т. е. в пределах htm-файла, содержащего данный скрипт либо его вызов из внешнего .js-файла). Если же с помощью скрипта открыть новое, дополнительное окно, присвоив ему собственное имя, то для обращения к элементу, содержащемуся в загруженной в это окно странице, требуется указать перед словом document идентификатор этого окна, например: WinName.document.FormName.ButtonName

Аналогично дело обстоит и при наличии фреймовой структуры. Здесь каждый создаваемый фрейм получает имя, используемое затем в тэге <А HREF. . . TARGET. . .>. Одновременно с этим существует и «безымянный» основной документ, определяющий вид фреймов, — в Java-скрипте ему соответствует «общее» имя parent («родительский», «порождающий»). Эти имена и указываются в цепочке «пути» к объекту

Например:

FrameName . document. FormName (обращение из «основного» окна к форме с именем FormName, содержащейся на странице, загруженной в фрейм с именем FrameName);

parent. FrameName. document. FormName (обращение к той же форме, но уже из скрипта, загруженного в другой фрейм; оно производится как бы «сквозь» фреймовую структуру и «сквозь» «родительский» документ);

parent.document (обращение из фрейма к «родительскому» документу и таким образом ко всему содержимому рабочего окна браузера, например, чтобы изменить количество и/или параметры фреймов либо загрузить в это окно другое содержимое).

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

<А HREF="#" onClick="" onclick="return false">ссылка

где nl, n2 и т.д. - порядковые номера требуемых фреймов (по порядку записи тэгов , считая с нуля!), а записываемые в апострофах имена файлов (а если нужно, то также пути и адреса URL) указывают, что нужно загружать в эти фреймы. Пример (замена содержимого первого и третьего фреймов на файлы New_logot. jpg и New_page . htm соответственно):

<А HREF="" onclick="return false">

'New_logot.jpg';

top.frames[2].location='New_page.htm';">новые

логотип и страница

Здесь обращение к «родительской» структуре производится через «определение» всего окна браузера (top), т. е. данный «иерархический уровень» можно рассматривать как эквивалент parent.


2. Доступ к значениям параметров (свойств) объекта

Большинство параметров, указываемых в составе соответствующего тому или иному объекту тэга, в скриптовом программировании получает статус cвойств этого объекта (практически полная аналогия с Visual Basic). Эти свойства носят собственные имена (часто совпадающие с названиями соответствующих параметров тэга), а их значения могут переприсваиваться, приводя таким образом к изменению вида соответствующего объекта Например, следующая строка заменяет содержимое текстового поля ввода TxtName, включенного в состав расположенной на текущей странице формы FormName, на заданную строку:

document.FormName.TxtName.value = "Новый текст"

Здесь переприсваивается значение свойства (параметра) VALUE, которое, как мы помним, в тэге «ответственно» за содержимое поля ввода.

Точно так же можно, наоборот, получить набранную пользователем в этом поле текстовую строку, поместив ее в некую переменную для последующей обработки в скрипте:

TxtMessage = document.FormName.TxtName.value

Аналогично, правая часть вышеприведенного равенства может использоваться в качестве аргумента другого обращения (скажем, чтобы вывести в окне сообщение, включающее ранее введенные пользователем в соответствующем текстовом поле имя и фамилию) или в составе логического условия в операторе if:

if (document.FormName.TxtName.value == "Иванов")

// проходи

else {

// стой!

}

3. Объекты и события
   

Язык " onclick="return false">window); в нем в качестве вложенного объекта рассматривается его содержимое —
HTML-документ (document); в него вложена, среди прочих объектов
(абзацев, если они поименованы, гиперссылок, других форм и пр.) наша форма, в которую, в свою очередь, вложен флажок, который имеет среди прочих свойств значение (value). В этом случае для доступа к значению одного из пунктов списка потребуется записать всю иерархию вложений через десятичную точку, например:

х = window.document.MyForm.MyCheckbox.value

Когда речь идет о содержимом того же самого документа, в котором содержится данный скрипт, слово window можно опустить, если только речь не идет о свойствах или объектах, связанных именно с окном, а не с документом. В последнем случае важно обратить внимание на тот факт, что с точки зрения " onclick="return false">window, если же с параметрами именно самой Web-страницы (как единого целого либо ее отдельных составляющих), то речь должна идти уже об объекте document.

Имена объектов обычно указываются в составе определяющих их тэгов (параметр NAME, например для форм и их элементов, фреймов и пр., или параметр ID, добавляемый, в частности, в состав тэга <Р>, чтобы выделить соответствующий абзац текста как отдельный объект). Объекты с именем, указанным в качестве значения параметра NAME, обычно считаются типичными для HTML и в строке достаточно указать их имена; если же имя указывается в каче­стве значения параметра ID, то обращение к таким объектам производится через запись all («все содержимое документа»). Например:

х = document.all. myparag <свойство>

для доступа к указанному свойству абзаца, в составе открывающего тэга <Р> которого включен параметр ID="myparag". Аналогично, через document. all обращение производится и к поименованным (параметр NAME), но не заключенным в контейнер формы диалоговым элементам.

Над каждым из имеющихся на экране объектов могут совершаться те или иные действия — как автоматически (например, по истечении заданного промежутка времени, отсчитываемого встроенным в компьютер таймером), так и, в основном, по командам__пользователя: Такие действия пользователя (например нажатие или отпускание любой клавиши, одинарный или двойной щелчок мышью, нажатие или отпускание ее кнопки в то время как курсор мыши наведен на данный элемент интерфейса, да и сам факт наведения на него мышиного курсора), равно как и действия, совершающиеся автоматически, в Windows стандартизированы, а факт их совершения называется событием, произошедшим (совершившимся) для данного объекта. При этом события отслеживаются операционной системой автоматически, так что от программиста требуется лишь написать набор подпрограмм (в " onclick="return false">
Всякий раз, когда операционная система фиксирует совершение какого-либо события, ею генерируется соответствующее прерывание и на исполнение вызывается присвоенный этому событию скрипт. (Те, кому приходилось иметь дело с Visual Basic, хорошо знакомы с этими принципами, только в VB подпрограммы обработки пишутся отдельно для каждого события каждого объекта, а скрипт, как правило, определяет действия компьютера, соответствующие данному событию для текущего объекта — того, на который в настоящий момент указывает курсор мыши.)

Вот, например, как для кнопки, являющейся элементом размещенной на Web-странице формы, программируется реакция ЭВМ на событие «щелчок мышью» — подстановка в имеющееся в этой же (или другой указанной в скрипте) фор­ме текстовое поле ввода требуемой строки:




VALUE="Автоввод" onClick="document.

FormName.TxtName.value = 'Вставляемый текст' ">


Здесь строка-обращение к параметру (свойству) value объекта «поле ввода» (с указанием его имени TxtName и всей иерархии доступа к нему), которая должна присвоить этому параметру взамен его старого значения фразу «Вставляемый текст», присвоена событию onClick, означающему однократный щелчок мышью на данном объекте, т. е. на кнопке, создаваемой на Web-странице при помощи данного тэга <INPUT>. Заметим, что при необходимости можно присвоить одному и тому же событию несколько скриптовых строк, например, записав несколько операторов присваивания внутри кавычек через точку с запятой:

onClick ="<первый оператор присваиваниям <второй оператор присваивания>”

При этом нужно отметить использование в подобных строках кавычек и апострофов: вставляемая фраза (новое значе­ние параметра VALUE) должна быть заключена в кавычки, но и вся строка, присвоенная событию onClick, также должна быть заключена в кавычки. Чтобы избавиться от путаницы, " onclick="return false">
Нужно также отметить и следующую специфику HTML и " onclick="return false">При этом в распоряжении разработчика скрипта имеется возможность «разорвать» эту цепочку, запретив распространение события на объекты более высокого уровня вложенности.

Другая специфика связана с тем, что некоторые события предполагают реакции, запускаемые по умолчанию, например переход по ссылке при щелчке мышью на ней или же вызов встроенного Help-файла для данного браузера при нажатии клавиши F1. В этом случае, если мы перехватываем эти события (т. е. хотим присвоить им собственные подпрограммы обработки, выполняющие какие-то другие действия взамен предусмотренных по умолчанию для таких объектов), то сразу же после исполнения назначенной нами для них функции последует и действие, выполняемое по умолчанию, если только мы в своей функции не запретим исполнение действия по умолчанию, воспользо­вавшись соответствующей возможностью " onclick="return false">
Описанная здесь «объектно-событийная» идеология опре­деляет главную особенность практической работы с " onclick="return false">

4. Методы и функции
   

Действия компьютера в ответ на произошедшее событие (более сложные, чем простое переприсваивание значения какого-либо свойства объекта) обычно реализуются вызовом тех или иных стандартных подпрограмм, которые в Java называются методами. Примерами методов являются open (), close (), .write () и пр.

Обращение к методам в " onclick="return false">
WinName.document.write("Текст") — выводит в окно с именем WinName в качестве содержимого заданное слово;

WinName = window.open () —открывает (создает) новое окно с именем WinName.

В отличие от методов, функции в " onclick="return false">

5. Переменные-макроподстановки
   

В отличие от обычных языков программирования, в " onclick="return false">

WinName.document.write("Текст 1"); WinName.document.write("Текст 2") ; WinName.document.write("Текст 3");

WinName.document.write("Текст n") ; заменяется на фрагмент

DocName = WinName.document; DocName.write("Текст 1"); DocName.write("Текст 2");

DocName.write("Текст n");


Вопросы для повторения:

1. Назовите основные принципы работы со скриптами.
   
2. Поясните на примере понятие объектной модели браузера.
   
3. Как происходит доступ к значениям параметров (свойств) объекта?
   
4. К какой категории языков программирования относится " onclick="return false">
5. Что является событием в ООП? Приведите пример события.
   
6. Какова специфика HTML и " onclick="return false">
7. Что такое метод? Приведите пример.
   
8. Что является функцией в " onclick="return false">
9. Для чего используют переменные-макроподстановки?