ГЛАВА 14. Введение в Web-программирование. Язык JavaScript
ГЛАВА 14. Введение в Web-программирование. Язык JavaScript
Web-дизайн состоит из трех частей: содержимого, представления и поведения. Это мы узнали еще в главе 1. Содержимому была посвящена часть I, представлению — часть II. Теперь настала очередь обсудить поведение.
Поведение — это набор правил, определяющих, как Web-страница будет реагировать на действия посетителя. Так, мы можем указать, чтобы при наведении курсора мыши на гиперссылку в полосе навигации менялся цвет и стиль рамки, в которую она заключена. Еще мы можем менять содержимое Web-страницы после ее загрузки или даже дополнять его, заставлять контейнер расширяться при щелчке мышью, открывая свое содержимое, анимировать элемент Web-страницы и делать множество других интересных вещей с самой Web-страницей и любым ее фрагментом.
Поведение создается с помощью так называемых Web-сценариев — программ, которые записывают прямо в HTML-коде Web-страниц или, что предпочтительнее, в отдельных файлах. Эти программы пишут на языке JavaScript. Web-обозреватель считывает JavaScript-код и последовательно выполняет записанные в нем выражения, проводя вычисления и выполняя на основе полученного результата заданные манипуляции над Web-страницей.
Эта глава будет целиком посвящена принципам Web-программирования, языку JavaScript и средствам, предоставляемым Web-обозревателем для написания Web- сценариев. Она будет очень большой, так что приготовимся к долгому чтению и обилию новых терминов.
Примеры Web-сценариев
Язык JavaScript лучше всего изучать, имея перед глазами пару хороших примеров. Поэтому давайте сразу создадим их.
Простейший Web-сценарий
Первый Web-сценарий, который мы напишем, будет совсем простым. Он выведет на Web-страницу текущую дату.
В самом начале этой книги, приступив к изучению HTML, мы создали небольшую Web-страничку 1.1.htm. Найдем ее и откроем в Блокноте. В самом конце ее HTML- кода, перед закрывающим тегом </BODY>, вставим код листинга 14.1.
Листинг 14.1
<SCRIPT>
var dNow = new Date();
var sNow = dNow.toString();
document.write(sNow);
</SCRIPT>
Это Web-сценарий. Мы поместили его прямо в HTML-код Web-страницы.
Сохраним исправленную Web-страницу и откроем ее в Web-обозревателе. В самом низу мы увидим новый абзац, содержащий сегодняшнюю дату в "международном" формате.
Наш первый Web-сценарий — поведение Web-страницы — работает!
Теперь немного исправим его так, чтобы он выводил дату в привычном для нас формате <число>.<месяц>.<год> (листинг 14.2).
Листинг 14.2
<SCRIPT>
var dNow = new Date();
var sNow = dNow.getDate() +"." + dNow.getMonth() +"." + dNow.getFullYear();
document.write(sNow);
</SCRIPT>
Обновим открытую в Web-обозревателе Web-страницу, нажав клавишу <F5>. Вот теперь дата отображается в привычном формате.
Данный текст является ознакомительным фрагментом.