Материал: Web-дизайн. лабораторный практикум. Суворов А.П., Проценко В.Н
Объект window использует три метода отображения сообщений:
метод prompt() – выводит диалоговое окно с полем ввода, куда пользователь может ввести информацию
метод alert() – выводит на экран окно - сообщение с кнопкой ОК и определенным программистом текстом
метод confirm() – выводит диалоговое окно с кнопками ОК и Cancel. Дает возможность пользователю продолжить или отменить предложенную операцию.
Сообщение, которое вы хотите вывести на экран, набирается в кавычках внутри круглых скобок.
Данный скрипт запрашивает имя посетителя и выдает приветствие с введенным именем.
<script language="JavaScript">
name=window.prompt ("Введите, пожалуйста,свое имя", "Ваше имя"); window.alert ("Вас зовут, " + name); </script>
В этом фрагменте кода метод prompt имеет следующие параметры: текст запроса и значение, заполняющее поле ввода по умолчанию; переменная name - имя переменной, куда сохраняется введенная информация (имя может быть любым).
Объект document
Объект document имеет дело, прежде всего с телом HTML-страницы. Он имеет несколько дочерних объектов (коллекций): all, images, link, anchor и form. Пользуясь объектной моделью построения документа можно, например, обратиться к любой картинке на странице через следующий синтаксис:
document.images.name.src
Для document не существует никаких событий. Некоторые свойства и методы перечислены в таблице, из методов наиболее употребляемы write и writeln.
|
|
|
|
Таблица 1.10 |
|
Свойства |
|
Назначение |
|
|
|
|
Устанавливает цвет фона текущего документа. |
Этот цвет |
|
||
|
может иметь шестнадцатеричное представление #rrggbb |
|
|||
|
или |
соответствующее |
название. |
Синтаксис: |
|
bgColor |
document.bgColor="#e7e6d8" |
|
|
|
|
40
|
Продолжение табл. 1.10 |
|
fgColor |
Устанавливает цвет текста документа. |
|
|
Аналогичен по функциям свойству bgColor |
|
|
|
|
referrer |
Указывает url документа, на который ссылается |
|
|
пользователь в настоящее время. Например, если кто-то |
|
|
обратился по адресу: http://www.nm.org/welcome.htm с |
|
|
сервера http://www.someplace.com, то свойством referrer |
|
|
будет: http://www.someplace.com, если это свойство было в |
|
|
странице вышеупомянутого расположения; в противном |
|
|
случае оно обращается в null |
|
|
|
|
location |
Соответствует адресу url текущего документа |
|
|
|
|
Таблица 1.11
Методы |
Назначение |
|
Записывает HTML-текст в текущий документ и должен |
|
вызываться, когда документ открывается для записи. |
|
Синтаксис: document.write('somestring'), где somestring |
write() |
может быть одной строкой, переменной или же |
несколькими связанными строками в формате HTML, |
|
writeln() |
которые выводятся на экран |
|
Показывает дату последней модификации документа: date1 |
lastModified() |
= document. lastModified |
|
Открывает документ для записи дополнительных строк в |
open() |
формате HTML: document.open() |
|
Закрывает документ, который вызывался методом |
close() |
document.open(): document.close(). |
Методы write() / writeln().
Вызов метода document.write() с указанием определенных параметров приводит к отображению текста в окне браузера. В качестве параметра при вызове метода document.write() мы указываем строку, которую хотели бы увидеть на экране.
<script language="JavaScript">
document.write('Пример вывода сообщения в окно браузера') </script>
41
Выводимая строка может содержать и тэги языка HTML. В этом случае браузер выведет данную строку точно так же, как если бы она была размещена непосредственно в HTML документе.
<script language="JavaScript"> document.write('<h1><b><i>Пример вывода сообщения в окно
браузера</i></b></h1>') </script>
При написании скрипта, содержащего несколько команд document.write() подряд, при выводе в браузер текст окажется на одной строке
<script language="JavaScript"> document.write ('Строка 1') ; document.write ('Строка 2') ; </script>
Для размещения каждого куска текста в новом абзаце можно использовать 2 способа:
1.либо тег <p>, либо тег <br>, который включается в состав выводимой
строки;
2.используя метод document.writeln().
Следующие примеры приведут к одинаковому результату:
<script language="JavaScript"> document.write ('Строка 1<br>') ; document.write('Строка 2<br>') ; </script>
42
и
<script language="JavaScript"> document.writeln ('Строка 1') ; document.writeln ('Строка 2') ; </script>
Объект location
Объект location содержит информацию о местонахождении текущего документа, т.е. его интернет-адрес. Его также можно использовать для перехода на другой документ и перезагрузки текущего документа.
|
|
Таблица 1.12 |
|
Свойство |
|
Описание |
|
hash |
Имя "якоря" в интернет-адресе документа, если оно есть. |
|
|
host |
Имя компьютера в сети интернет вместе с номером |
|
|
|
порта, если он указан. |
|
|
|
|
|
|
hostname |
Имя компьютера в сети Интернет. |
|
|
href |
Полный интернет-адрес документа. |
|
|
pathname |
Путь и имя файла, если они есть. |
|
|
port |
Номер порта. Если не указан, возвращает номер 80 - |
|
|
|
стандартный порт, через который работает протокол http. |
|
|
|
|
|
|
protocol |
Идентификатор протокола. Если не указан, возвращается |
|
|
|
"http:". |
|
|
|
|
|
|
search |
Строка параметров, если она есть. |
|
|
|
|
|
|
|
|
Таблица 1.13 |
|
Метод |
|
Описание |
|
|
|
|
|
assign(url) |
|
Загружает документ, адрес которого передан в качестве |
|
|
|
параметра. |
|
|
|
Поддерживается только IE начиная с 4.0 |
|
43
|
Продолжение табл.1.13 |
|
reload() |
Перезагружает документ с Web-сервера. |
|
replace(url) |
Загружает документ, адрес которого передан в качестве |
|
|
параметра, и заменяет в списке истории Web- |
|
|
обозревателя адрес предыдущего документа адресом |
|
|
нового. |
|
Пользуясь объектом location, можно загрузить другой документ на место текущего. Для этого просто необходимо присвоить значение нового интернет-адреса свойству href.
document.location.href = "http://www.---.ru";
Если вы хотите полностью заменить текущий документ, чтобы даже адрес его не появлялся в списке истории, воспользуйтесь методом replace:
document.location.replace("http://www.--.ru");
Объект form
Каждая форма в документе, определенная тегом <form>, создает объект form, порождаемый объектом document. Cсылка на этот объект осуществляется с помощью переменной, определенной в атрибуте name тега <form>. В документе может быть несколько форм, поэтому для удобства ссылок и обработки в объект document введено свойство-массив forms, в котором содержатся ссылки на все формы документа. Ссылка на первую форму задается как document.forms[0], на вторую - document.forms[1] и т.д. Вместо индекса в массиве forms можно указывать имя формы. Например, если в документе присутствует единственная форма со значением атрибута name=form1, то любой из следующих операторов JavaScript содержит ссылку на эту форму:
document.forms[0]; document.forms["form1"]; document.form1;
Последний оператор возможен в силу того, что объект document порождает объект form (как и все остальные объекты, соответствующие элементам HTML страницы) и ссылку на него можно осуществлять по обычным правилам наследования языка JavaScript.
44