Контрольнаяработа 12
Тема: «Приемы программирования наJavaScript»
Пример 1.Программа выдачи простогопредупреждения при выборе гипертекстовой ссылки. СхемаURL — JavaScript
Самый первый пример JavaScript
Мой первый пример JavaScript
В текст этого документавнедрена гипертекстовая ссылка
«Don`tclick here»
.
Любопытно, что будет,если все-таки выбрать?
В данном примере средитекста документа расположена гипертекстовая ссылка «Don`t clickhere». Если ее выбрать при просмотре (кликнуть мышкой), то на экранепоявится окно-предупреждение с вопросом: «Do you speak English?».
Генерация этого окнаосуществляется специальным методом window.alert, который выполняется при выборегипертекстовой ссылки. Если быть более точным, то в качестве URL информационногоресурса, который следует загрузить при переходе по данной гипертекстовойссылке, используется схема JavaScript — расширение спецификации URI для программированиясценариев просмотра гипертекстовых документов World Wide Web. В этом случаевыполнение JavaScript-программы происходит при выборе гипертекстовой ссылки, асам код программы записан как URL.
Добиться такого жеэффекта можно и другим способом, не прибегая к новой схеме URL. Для этой целиможно использовать событие, которое генерируется программой-навигатором при выборегипертекстовой ссылки — Click.
Пример 2.Программа выдачи простогопредупреждения по событию Click при выборе гипертекстовой ссылки
Самый первый пример JavaScript
Мой первый пример JavaScript
В текст этого документавнедрена гипертекстовая ссылка
English?’)»>«Don`tclick here». Любопытно, что будет,
если все-таки выбрать?
Обойтись без новой схемыURL здесь также не удается, но она используется только для того, чтобы послевыбора гипертекстовой ссылки в рабочем поле программы навигатора не появлялосьпустой страницы, или не приходилось загружать вновь старую страницу. Дляобработки события используется конструкция onClick, которая реализует обращениек обработчику (handler) данного события, который в свою очередь вызываетвыполнение кода, записанного вслед за onClick.
Размещение кода программына JavaScript непосредственно в тагах HTML является обычным делом, но не всегдабывает удобным. Наиболее часто JavaScript-код выносят в специальныйHTML-контейнер SCRIPT(…..). Для того, чтобыпродемонстрировать применение этого подхода, видоизменим наш пример следующимобразом:
Пример 3.Применение контейнера SCRIPT дляразмещение JavaScript-кода
Самый первый пример JavaScript
functionquestion()
{
window.alert(«Doyou speak English?»);
}
// –>
Мой первый пример JavaScript
В текст этого документавнедрена гипертекстовая ссылка
«Don`t click
here».Любопытно, что будет, если все-таки выбрать?
Данный пример развиваетприменение JavaScript-кода для обработки события Click. Но только в этом случаемы не размещаем весь код обработки события в атрибуте onClick. В данный атрибутпомещается только вызов функции, которая будет обрабатывать это событие. Самотело функции размещено в заголовке HTML-документа внутри тагов и
Для того, чтобы защититьтекст функции от интерпретации браузерами, которые не поддерживают JavaScript,мы поместили код в HTML-комментарий. При этом последняя строка этогокомментария должна начинаться как комментарий JavaScript, чтобы браузер,понимающий JavaScript, не интерпретировал ее как часть JavaScript-кода.
Различные браузерыподдерживают разные версии JavaScript, что накладывает определенные ограниченияпри написании сценариев JavaScript. Для того, чтобы максимально адаптироватьсвою программу к конкретному типу программного обеспечения, часто включаютпроверку версии и имени программы-браузера в JavaScript.
Пример 4.Получениетипа программы просмотра HTML-страниц
Testof Browser name
Проверка имени типа браузера;
Для того, чтобы получитьимя вашей программы просмотра
выберите кнопку «Browser»
onClick=«window.alert(window.navigator.appName)»>
Данная программа вточности повторяет пример 2.10, но в окне предупреждения выдает имя программыпросмотра HTML-страниц (window.navigator.appName). Вообще говоря, в простомсообщении о типе программного обеспечения большого смысла нет, но если вставитьпроверку данного имени в текст HTML-страницы и реализовать условную компиляциюстраницы, то тогда обращение к данной конструкции JavaScript будет оправданным:
Пример 5.Условнаягенерация текста страницы по типу программы просмотра
Testof Browser name
Проверка имени типа браузера
if(window.navigator.appName== «Netscape»)
{
document.write(“”);
document.write(«Увас хороший навигатор.»);
document.write(“”);
}
else
{
document.write(“Необходим Netscape Navigator
версии 3.0 и выше.”);
window.alert(«Download new version of your browser now.»);
}
// –>
В данном примере текстJаvaScript-программы размещен непосредственно в теле документа. При егозагрузке, когда HTML-интерпретатор доходит до контейнера SCRIPT, вызываетсяJavaScript-интерпретатор. В этот момент будет проверяться условие, котороесодержится в операторе if. В зависимости от результата проверки этого условияостальной текст страницы примет тот или иной вид в зависимости от типапрограммы просмотра.
Вообще говоря, проверитьтип программы просмотра можно на сервере протокола HTTP и передать программепросмотра уже готовую страницу без условной генерации ее содержания. Но этовозможно только в том случае, когда автор страницы имеет возможностьпрограммировать на машине где установлен сервер и имеет возможностьадминистрировать этот сервер. В ряде случаев, когда место под Websiteарендуется и в договоре аренды нет пункта, обеспечивающего управление ресурсамисервера, в этом случае программы с условной генерацией содержания страницбывают чрезвычайно полезными. Другой случай — это работа в локальном режиме безсервера. Здесь JavaScript является единственным средством управленияпросмотром. Существует еще ряд случаев, когда применение контейнера SCRIPT втеле документа является вполне оправданным, но на них мы остановимся позже вконтексте решения конкретных задач управления сценариями просмотра.
Однако, чаще всего, текстJavaScript-кода размещают в виде описания функций в заголовке документа, чтоделает использование такого кода более удобным. Связано это с двумя моментами,которые следует учитывать при написании JavaScript-программ: область действияописания программы (из каких частей документа или страницы она видна, аследовательно, на нее можно сослаться как на функцию, и принципы интерпретациикода при просмотре документа.
Если код размещается втеле документа, то он интерпретируется только в случае переразметкиотображаемого документа (загрузка, изменение параметров окна, перезагрузка).Если текст размещен в заголовке, то на него можно сослаться из любого местадокумента, а точнее из любого обработчика событий, которые указываются какатрибуты HTML-тагов.
Пример 6.Размещение скрипта в отдельном файле(netscape.jsc)
Testof Browser name
Проверка имени типа браузера
В данном случае текстусловной генерации страницы размещен во внешнем файле. При загрузке страницыэтот текст докачивается программой просмотра и исполняется так же, как если быон размещался в документе. Любопытно, что при просмотре текста документа черезопцию «View Source» текст скрипта не отображается, что даетвозможность скрыть его содержание от пользователя. В самом файле, которыйсодержит конструкции JavaScript, HTML-таги не используются:
Пример 7.Содержание файла netscape.jsc,ссылка на который установлена в атрибуте SCR тага .
if(window.navigator.appName== «Netscape»)
{
document.write(“”);
document.write(«Увас хороший навигатор.»);
document.write(“”);
}
else
{
document.write(“Необходим Netscape Navigator
версии 3.0 и выше.”);
window.alert(«Download new version of your browser now.»);
}
На этом можно закончитьвступительную часть, посвященную примерам JavaScript-кода, и перейти к болеепланомерному изложению приемов программирования на JavaScript, если бы не одно«но». Дело в том, что любой автор, который собирается излагатьпрограммирование на JavaScript, встречается с проблемой постепенногонаращивания сложности примеров. Материал надо начинать излагать «отпечки», но вот этой самой печки нет. Все программы на JavaScript(Client-site JavaScript) — это в той или иной мере программы обработки событий,которые связаны с теми или иными информационными объектами. Без изучения этихобъектов нельзя начинать ничего программировать.
Однако, существуетлазейка в этом заколдованном круге, которой мы и воспользуемся. Это схемаJavaScript универсального локатора ресурсов (URL). В наших примерах мы ужеиспользовали эту схему. Она помогала нам открывать окно-передупреждение привыборе гипертекстовой ссылки и избегать перезагрузки страниц. Мы будемпользоваться этой схемой вызова JavaScript-кода до тех пор, пока не появится внашем рассмотрении объект (контейнер HTML) с атрибутом обработки события.
После этого небольшогоотступления начнем рассматривать приемы программирования на JavaScript всоответствии с иерархией объектов этого языка, начиная с самого старшегообъекта и двигаясь вглубь дерева объектов: от объекта «окно» кэлементам формы.
Рекомендуемаялитература
«Информатика и образование», №8, 2000Е. В. Давыдова.
Пайк М. «Internet в подлиннике» СПб.:BHV-Санкт-Петербург, 1996.
Перри П. Дж. «Секреты World Wide Web»Киев: Диалектика, 1996.
Шарф Д. «HTML 4.0: Справочник» СПб:Питер, 1998.
Вуд Л. «Web-графика: Справочник» СПб:Питер, 1998.