Методические указания по выполнению лабораторных работ

ФЕДЕРАЛЬНОЕ АГЕНТСТВО ПО ОБРАЗОВАНИЮ

ГОУ ВПО «Тверской государственный технический университет»

Методические указания по выполнению лабораторных работ

по дисциплине «Интернет в административном управлении»

для специальности 351400 – «Прикладная информатика в экономике»

Тверь 2006
Лабораторная работа № 1

Часть первая

Первый скрипт познакомит вас с самыми основами создания и размещения JavaScript на веб-странице. Вы узнаете о том, что можно и чего нельзя делать в JavaScript. Первый скрипт помещает текст на веб-страницу. В данном случае текст будет красного цвета.

Скрипт

<SCRIPT LANGUAGE="javascript">

document.write("<FONT COLOR='RED'>Это красный текст</FONT>")

</SCRIPT>

Что такое JavaScript?

Во-первых, это не Java. Java — это язык программирования, разработанный в Sun Microsystems. А JavaScript придумали люди из Netscape. Но это не единственное отличие. Оба языка представляют собой ООР (Object Orientated Programming, объектно-ориентированный язык программирования). Это значит, что с их помощью можно строить небольшие объекты, из которых потом складывается целое. Главное отличие в том, что Java позволяет создавать совершенно самостоятельные события. «Java-applet» («приложения») может запускаться с веб-страницы, но на самом деле это полностью независимая программа, хоть и маленькая. К тому же ее нельзя просмотреть в виде текста. Для запуска ее необходимо «транслировать» в то, что называется «машинным языком». Netscape как бы упростил Java до набора более простых команд. JavaScript не может существовать сам по себе, он должен находиться внутри веб-страницы, а веб-страницу необходимо просматривать в браузере, который понимает язык JavaScript (скажем, Netscape Communicator и Internet Explorer). Для начала запомните, что JavaScript — это не HTML! У JavaScript и HTML очень похожие правила. Во-первых, JavaScript располагается внутри документа HTML. JavaScript сохраняется в виде текста вместе с документом HTML. Главная же разница в том, что в HTML имеет довольно расплывчатые правила. Не имеет значения, сколько пробелов вы оставляете между словами или абзацами. У JavaScript четкая форма. И пренебрегать ею можно лишь изредка. Например, вторая строка нашего скрипта выглядит следующим образом:

document.write("<font color='red'>Красный текст</font>")

То есть, целиком находится на одной линии и должна сохранять свою форму.

Всегда редактируйте свою работу в текстовом редакторе без полей. Имеется в виду не очень широкую страницу, а ПОЛНОЕ ОТСУТСТВИЕ ПОЛЕЙ.

Для JavaScript очень важен РеГиСтр. Некоторые скрипты по-разному действуют в Нетскейпе и Експлорере.

Разбор скрипта

Начнем с первой строки:

<SCRIPT LANGUAGE="JavaScript">

Это код HTML, который дает браузеру понять, что с этого места начинается JavaScript. Все скрипты начинаются с такой команды. А как насчет части LANGUAGE (язык) ="JavaScript"? Есть еще и другие типы скриптов, например, VBS. Так что ваша команда LANGUAGE не даст браузеру запутаться.

Этим: </SCRIPT>...заканчивается любой JavaScript без исключений. Помните, начинаем с <SCRIPT LANGUAGE="javascript"> и заканчиваем </SCRIPT>.

Вот основная часть скрипта:

document.write("<FONT COLOR='RED'>Это красный текст</FONT>")

Указывается DOCUMENT (документ HTML) и те изменения, которые в нем произойдут — что-то будет написано (WRITE). То, что будет написано, находится в скобках. DOCUMENT представляет собой object (объект). Слово WRITE (писать), отделенное точкой, называется method (методом объекта). Текст в скобках называется instance (примером метода), он передает то, что происходит, когда метод воздействует на объект. Имейте в виду, что текст внутри скобок находится в кавычках. Текст в кавычках представляет собой простой HTML. Команда <FONT> делает текст красным. Обратите внимание, что дальше идут одинарные кавычки. Если поставить двойные, JavaScript решит, что это конец строки, и получится, что только часть вашего текста будет применена к объекту, а это уже ошибка.

Запомните: внутри двойных кавычек ставятся одинарные.

Задание

Измените скрипт так, чтобы вышли две строки текста, красная и синяя. Но вам придется дописать несколько команд Javascript, а не просто добавить немного HTML к приведенному примеру. Используйте команду <BR> в конце первого примера, чтобы текст располагался на двух строках.

Попробуйте изменить заголовок страницы с помощью скрипта, используя, для этого соответствующий тег (<title>). Попробуйте добавить на страницу список содержащий 3-5 элементов (это тоже необходимо сделать с помощью скрипта).

Часть вторая

JavaScript — это чрезвычайно логичный язык, требующий, чтобы все шло своим чередом, друг за дружкой. Допустим, у вас 10 ошибок в длинном скрипте. Сообщения накладываются одно на другое, и последняя обнаруженная компьютером ошибка окажется сверху. Не набрасывайтесь на нее сразу, возможно, в действительности ее даже не существует. Может случиться так, что первая ошибка в скрипте и вызовет все остальные. Так что исправлять их следует от начала документа HTML. Поэтому исправляйте ошибки по одной от начала до конца. И каждый раз, исправив одну ошибку, запускайте скрипт. Можно получить 20 окошек с восклицательным знаком, а исправлять придется одну или две ошибки.

«Определение отсутствует» – Эта ошибка сценария тоже часто встречается. Она означает, что в скрипте что-то не согласовано. Случаются и банальные опечатки. Приглядитесь к тексту повнимательнее, опечатки случаются чаще, чем можно себе представить. Вот практически все, что на данном этапе можно сказать про ошибки.

Задание

Ниже приведен текст скрипта.

<html>

<head>

<title>Испорченный скрипт</title>

<link REL="STYLESHEET" TYPE="text/css" HREF="blue1.css" tppabs="http://jsp.newmail.ru/blue1.css">

</head>

<body>

<script LANGUAGE="JavaScript">

...x

dothis = new Date()

month = dothis.getMonth()

month = (month * 1) + 1

day = dothis.getDate()

year = dothis.getFullYear()

document.wrte(" ",day,"/",month,"/",year," ")

</script>

<p>"Попробуйте найти ошибку!"</p>

</body>

</html>

Скопируйте его в новый тесктовый файл с расширением html и откройте в Internet Explorer. Загружая страницу, браузер должен выдать вам два сообщения об ошибке. Исправьте их. Некоторые команды покажутся вам незнакомыми, но это неважно. Из сообщения вы получите достаточно информации, чтобы наладить скрипт. Если он заработает, то на странице появится сегодняшняя дата. Каждая ссылка откроется в новом окне.

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

Часть третья

Работа с Датой-Временем

Рассмотрим семь методов объекта: getDay(), getDate(), getMonth(), getYear(), getHour(), getMinute(), и getSecond() (получитьДень, Число, Месяц, Год, Час, Минуту, Секунду). Все они уже существуют, их можно взять и поместить на страницу.

Разберем скрипт:

<SCRIPT LANGUAGE="JavaScript">

//Скрипт отмечает точную дату и время вашего прибытия на страницу

Now = new Date();
document.write("Сегодня " + Now.getDate()+
"-" + Now.getMonth() + "-" + Now.getFullYear() + ".
Вы зашли на мою страницу ровно в: " + Now.getHours() +
":" + Now.getMinutes() + " и " + Now.getSeconds() +
" секунд.")

</SCRIPT>

Результатом всех методов являются цифры и об этом необходимо помнить. Даже метод getDay(), который отвечает за день недели, выражается цифрой от единицы до семи. Начнем с месяца. Как уже говорилось раньше, getMonth() — это метод, отвечающий за месяц. getMonth() является методом объекта Date. Взгляните на скрипт еще раз. Date занимает отдельное место в команде:

Now = new Date();

Таким образом устанавливается объект, с которым будет работать метод getMonth(). Имея дело с датой и временем, всякий раз пользуйтесь той же схемой. Нужно создать объект. Объект называется Now. Команда говорит: Now — это объект, который представляет new Date(). Дата обязательно должна быть новой. Таким способом вы будете получать новую дату каждый раз, когда заходите на страницу или обновляете ее.

Обратите внимание и на точку с запятой в конце. Она указывает на то, что строка JavaScript закончена.

Нам нужно напечатать месяц на странице, значит, где-то должна быть команда document.write().

Для слияния текста используется знака «плюс» + между элементами. Объект и метод разделены точкой, так что команда напечатать месяц выглядит так: Now.getMonth().

И вот что получилось:

<SCRIPT LANGUAGE="javascript">

//Скрипт напечатает на странице номер месяца

Now = new Date();
document.write("Сейчас месяц " + Now.getMonth())

</SCRIPT>

Метод Now.getFullYear сообщит год.

Задание

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

Часть четвертая

Работа с переменными

Рассмотрим два случая работы с переменными: получение информации от пользователя и создание самостоятельных переменных в JavaScript.

Снова понадобится стандартный формат от <SCRIPT LANGUAGE="javascript"> дo </SCRIPT>. Вот что мы собираемся сделать: мы спросим у пользователя, как его зовут, и присвоим этому имени переменную. Как только переменная будет присвоена, мы сможем ввести ее в строку document.write, которая напечатает это имя на странице.