HTML, XHTML и CSS на 100%
Шрифт:
Команды host, hostname, port, search не работают, если просматривать страницу с жесткого диска компьютера. Результат может быть только в том случае, если веб-страница размещается на сервере в Интернете.
Внимание!
Поскольку объект Location является частью объекта Window, доступ к нему осуществляется именно через этот объект: window.location.property.
Рассмотрим использование свойств объекта Location на примере сценария из листинга 10.16.
<html>
<head>
<title>URL текущего HTML-документа</title>
</head>
<body>
<script language=JavaScript>
<!– Маскировка сценария
document.write(location.href); //код JavaScript
// Конец маскировки сценария –>
</script>
</body>
</html>
Данный сценарий определяет полный URL-адрес текущего HTML-документа. При запуске сценария с жесткого диска вашего компьютера команда location. href покажет полный путь к файлу со сценарием (рис. 10.15).
Рис. 10.15. Путь к файлу со сценарием
Методы объекта Location позволяют перезагружать текущую веб-страницу или менять URL-адрес, загружать другую веб-страницу вместо предыдущей. При этом будет невозможен переход к предыдущей странице с помощью кнопки Назад в браузере пользователя. Возникает эффект, что страницы как бы подменяются друг другом.
Рассмотрим подробнее методы объекта Location.
• assign – загружает другую страницу, меняя URL-адрес текущей веб-страницы на адрес, указанный в параметре метода.
• reload – обновляет текущую веб-страницу (не всегда срабатывает правильно, поскольку некоторые браузеры все равно берут эту страницу из кэша, не обращаясь к серверу).
• replace – замена текущей веб-страницы страницей, URL которой указан в параметре метода. При этом в списке истории браузера адрес предыдущего HTML-документа заменяется адресом нового.
В листинге 10.17 приведен пример сценария, содержащего один из методов объекта Location – метод replace.
<html>
<head>
<title>Метод replace</title>
<script language=JavaScript>
<!– Маскировка сценария
function replaceDoc
{
window.location.replace("http://www.yandex.ru") //код JavaScript
}
// Конец маскировки сценария –>
</script>
</head>
<body>
<input type="button" value="Replace" onclick="replaceDoc" /> //кнопка
</body>
</html>
Сценарий позволяет изменить текущую страницу в окне браузера на главную
Рис. 10.16. Кнопка Replace
Таким образом, объект Location позволяет не только определять адрес загруженного в браузер HTML-документа, но, что более важно, загружать в текущее окно новую вебстраницу.
Итак, мы рассмотрели объекты браузера, их свойства и методы. Для HTML-документа и его содержимого в языке JavaScript также определены свои объекты.
10.4. Объектная модель документа (DOM)
Стандартный набор объектов в HTML-документе, их свойства и способ доступа к ним определяется объектной моделью документа (Document Object Model, сокращенно DOM). DOM позволяет управлять всеми элементами на веб-странице, изменять их свойства и содержание, создавать новые элементы.
Объект Document
Для работы с документами HTML в языке JavaScript существует отдельный объект – Document. Пользуясь его свойствами и методами, сценарий JavaScript может получить информацию о текущем документе, загруженном в окно браузера, а также управлять отображением содержимого этого документа.
Любая веб-страница, которую вы просматриваете в окне браузера, может быть описана как набор объектов. Она включает собственно HTML-документ «в целом» и более мелкие объекты – элементы веб-страницы. Например, заголовок, абзац_1, абзац_2, абзац_3, рисунок, ссылка, форма и т. п.
HTML-документ «в целом» и есть объект Document. Элементы веб-страницы называются HTML-объектами, поскольку определяются элементами языка HTML. Все HTML-объекты выступают в качестве дочерних по отношению к объекту Document. Благодаря этому вы можете обращаться к данным объектам из сценариев JavaScript.
Совокупность описывающих веб-страницу объектов со всеми их методами и свойствами в языке JavaScript называется объектной моделью документа. Объект Document является главным в этой модели. Он содержит внутри себя множество подчиненных объектов и коллекций.
Коллекция – это массив объектов, проиндексированный не только по числовым номерам элементов, но и по их именам и имеющий свойства и методы. Коллекция отличается от обычного массива именно наличием свойств и методов. Поэтому каждая коллекция сама по себе объект и в то же время свойство объекта Document.
Рассмотрим, какие же коллекции существуют для объекта Document.
• anchors – коллекция всех локальных меток («якорей»), размещенных в HTML-документе. Эти метки содержатся в тегах <a name="…"> </a> и применяются для организации ссылок внутри одной веб-страницы.