Методы объекта window

И так, мы дошли до методов объекта window.

Как мы знаем есть объект document, который позволяет управлять содержимым страницы.

Кроме самого сайта в браузере ещё много чего.

При помощи этого объекта можно получить информацию о браузере пользователя, его разрешении экрана и т.д.

Например объект hostory, позволяет просмотреть историю пользователя, например - с какой страницы он пришёл.

Или объект screen - содержит информацию о экране пользователя.

Объект window является родителем всех остальных объектов.

И так рассмотрим первый метод объекта window - метод open ().

Этот метод позваляет нам открывать новое окно браузера.

Этому методу передаются три параметра - тип окна, имя окна, параметры окна ( такие как размер... ).

Мы создадим простое окно размером 500 на 500 под именем Новое JS окно.

<script type="text/javascript">
	window.open ( "", "Новое JS окно", "width=500, height=500" );
</script>

У нас открылось новое окно, но оно пустое.

Но как же нам добавить в него какой-нибудь текст?

Метод open при успешном создании возвращает нам путь к новому окну и благодаря этому можно изменять параметры нового окно и добавлять в него какой-то контент.

Но как же в него добавлять контент?

Для этого воспользуемся объектом document.

Мы можем в переменную занести путь к новому окну и после прописывать так - переменная.document("content");

Но почему мы не прописываем каждый раз так - window.document();

А в новом окне так нужно делать?

Ответ очень простой:

Давайте рассмотрим на примере:

Мы в своём городе сходили в новый кинотеатр посмотреть кино, и своим друзьям говорите - я сегодня сходил в новый кинотеатр.

Но Вы не уточняете в каком городе, так как он находится в том же городе, что и Вы.

А изменять содержимое в неактивном окне - нельзя без пути к нему.

И для этого мы будем использовать путь к этому окну.

Давайте занесём в переменную путь к окну и при помощи объекта document и метода write, добавим в новое окно строку - Это окно создано с помощью JavaScript.

<script type="text/javascript">
	var newWin = window.open ( "", "Новое JS окно", "width=500, height=500" );
	newWin.document.write ( "Это окно создано с помощью JavaScript" );
</script>

Вот мы пока что и разобрали метод open.

Теперь рассмотрим ещё несколько методов объекта window.

Метод alert ().

Метод alert () позволяет вызывать модальное окно, в котором может находится какая-то информация и одно только кнопка - ок.

Почему оно модальное? А потому, что пока оно не закрыто, то остальные объекты на сайте будут не активны.

В прошлых версиях браузеров - из-за этих модальных окон, весь браузер был не активен, но теперь эта проблема решена.

В качестве параметров методу передаётся текст, который будет выведен в модальном окне.

Давайте выведем при помощи этого метода сообщение о том, что сайт работает с использованием JavaScript.

<script type="text/javascript">
	window.alert ( "Сайт работает с использованием JavaScript" );
</script>

Как мы и говорили - прописывать объект window здесь не обязательно, так как мы работаем в активном окне.

Метод prompt ().

Метод prompt () вызывает модальное окно, в котором будет находится вопрос, поле для ответа, и кнопка для подтверждения.

В качестве параметров методу передаются - вопрос, и подсказка в поле для ответа.

Давайте попросим пользователя ввести имя и выведем строку с приветствием, в котором будет содержаться введённое им имя.

<script type="text/javascript">
	var answer = window.prompt ( "Ваше имя", "введите имя" );
	document.write ( "Привет, " + answer + "!" );
</script>

Метод confirm ().

Метод confirm () вызывает модальное окно, в котором будет находится вопрос и две кнопки - ок и отмена.

В виде результата метод будет возвращать булевое значение в виде - ложь или истина.

Если пользователь нажмёт ок - то метод вернёт истину, иначе ложь.

В качестве параметра мы будем передавать вопрос.

Давайте спросим у пользователя знает ли он JavaScript.

<script type="text/javascript">
	var answer = window.confirm ( "Вы знаете JavaScript?" );
	if ( answer ) {
		document.write ( "Вступайте в нашу команду" );
	} else {
		document.write ( "Милости просим - http://web-stroiika.ru" );
	}
</script>

И так давайте закрепим полученный материал выполнив работу:

Давайте попросим пользователя отгадать число от 1 до 5.

Для этого вначале напишем выражение, которое будет возвращать случайное число от 1 до 5:

var randomnum = Math.floor ( Math.random() * 5 ) + 1;

Насчёт случайных чисел мы поговорим позже, а сейчас ваша задача в цикле у пользователя спрашивать случайное число, и как только он отгадает вывести при помощи метода alert () сообщение о том, что он отгадал.

Вот решение, но стоит попробовать самим:

<script type="text/javascript">
	var randomnum = 0, answer;
	while ( answer != randomnum ) {
		randomnum = Math.floor ( Math.random() * 5 ) + 1;
		answer = prompt ( "Угадайте число от 1 до 5", "введите число" );
		if ( answer != randomnum ) {
			alert ( "Не верно!" );
		}
	}
	alert ( "Вы угадали!" );
</script>

Поделиться...