Выполнила:
Проверил: Сунцова А.И.
Великая Я.Г. Дата: ____________________
Оценка: ____________________
Отчет по лабораторной работе №8
«Объекты браузера»
Вариант 1
Цель:
Изучить назначение объектов window,document,location,history.
Применить свойства и методы объектов для решения прикладных задач.
Содержание отчета:
Титульный лист.
Теоретическая часть.
Обязательно указать номер варианта, текст индивидуального задания.
Код html-страниц, выполненных для реализации примеров лабораторной работы.
Код html-страниц, выполненных согласно варианту.
Копии экрана, иллюстрирующие работу сценариев Javascript.
Пояснения к каждой копии экрана
Теоретическая часть
Объекты браузера в отличие от объектов ядра JavaScript не разобщены, а образуют иерархию, как показано на рисунке 1.
Корневым объектом является объект window, представляющий главное окно браузера и позволяющий создавать дополнительные окна. Объект document представляет загруженный в окно HTML – документ. Объект location управляет загрузкой HTML – документов и перемещением по ним. Объект history хранит список ранее загруженных в данное окно страниц и позволяет загружать их повторно.
Рисунок 1. Объекты браузера верхнего уровня.
Объект window имеет следующие свойства и методы:
Таблица 1. Основные свойства объекта window
Свойство |
Значение |
frames |
Содержит список фреймов, открытых в окне |
name |
Задает имя окна |
opener |
Ссылка на окно, из которого был сделан переход в текущее окно |
parent |
Ссылка на родительское окно |
self |
Ссылка на себя |
defaultStatus |
Строка статуса по умолчанию |
status |
Строка статуса |
top |
Ссылка на окно верхнего уровня |
Таблица 2. Основные методы объекта window
Метод |
Значение |
alert() |
Создает окно сообщения с некоторым текстом, передаваемым в качестве параметра |
open() |
Открывает новое окно |
close() |
Закрывает окно |
confirm() |
Выводит окно выбора |
prompt() |
Создает окно ввода строки |
focus() |
Делает окно активным |
scroll() |
Осуществляет прокрутку в окне |
clearTimeOut() |
Отмена задержанного действия |
clearInterval() |
Отмена периодического действия |
setTimeOut() |
Выполнение некоторого действия с задержкой |
setInterval() |
Выполнение некоторого действия периодически |
Отметим, что для корневого объекта window вызов свойств и методов может осуществляться без квалификации. Следующие вызовы эквивалентны:
window.prompt();
prompt();
2. Сценарии для управления содержимым окна браузера
Хотя в языке HTML есть собственные средства определения содержимого окна браузера: гиперссылки, их во многих случаях недостаточно. Гиперссылки являются статическими элементами страницы, они не могут реагировать на интерактивный ввод пользователя. Подобные задачи проще решаются с помощью объектов Location и History.
Объект Location имеет следующие свойства:
Таблица 3. Основные свойства объекта Location
Свойство |
Значение |
hash |
Имя анкера, указанное в адресе после # |
host |
То же, что и pathname+ port |
hostname |
Имя сервера, приславшего документ |
href |
Полный адрес |
pathname |
Путь и имя документа |
port |
Номер порта, используемого при взаимодействии сервера и браузера |
protocol |
Протокол, используемый при взаимодействии сервера и браузера |
search |
Часть адреса от знака ? и до конца |
Объект Location имеет небольшое число методов:
Таблица 4. Основные методы объекта Location
Метод |
Назначение |
reload() |
Повторно загружает страницу |
replace() |
Загружает другую страницу |
Эти методы также могут эффективно использоваться для управления содержимым окна браузера.
При создании собственной системы навигации на сайте часто желательно иметь кнопки перехода на следующую или предыдущую страницы в некоторой последовательности страниц. Создавать подобные кнопки проще всего с помощью объекта History. Объект History хранит ссылки на страницы, загруженные ранее в данное окно браузера. Он хранит ссылки в специальном стеке, поэтому циклические ссылки хранению не подлежат. Объект History имеет следующие методы:
Таблица 5. Основные методы объекта History
Метод |
Назначение |
back() |
Перемещает на предыдущую страницу |
forward() |
Перемещает на следующую страницу |
go() |
Перемещает на несколько страниц в начало go(-n) или вперед go(+n) |
С помощью объектов Location и History удается решать многие трудные задачи навигации, которые только одними гиперссылками решить не удается.