- Операторы
- Управляющие инструкции
- JS Объекты
- браузер BOM
- Window
- closed
- frameElement
- frames
- innerHeight
- innerWidth
- length
- name
- opener
- outerWidth
- outerHeight
- pageXOffset
- pageYOffset
- parent
- screenLeft
- screenTop
- screenX
- screenY
- self
- top
- alert()
- atob()
- blur()
- btoa()
- clearInterval()
- clearTimeout()
- close()
- confirm()
- focus()
- matchMedia()
- moveBy()
- moveTo()
- open()
- print()
- prompt()
- resizeBy()
- resizeTo()
- scrollBy()
- scrollTo()
- setInterval()
- setTimeout()
- stop()
- Navigator
- Screen
- History
- Location
- HTML DOM
- События
- HTML Объекты
- Промисы, async/await
- Сетевые запросы
- Бинарные данные и файлы
- Модули
- Классы
- Разное
Объект Window
Объект Window представляет собой открытое окно браузера.
Данный объект является корневым и все свойства, методы, функции и даже переменные являются его свойствами и методами.
Свойства
| closed | Возвращает логическое значение (true или false) в зависимости от того, закрыто указанное окно или отрыто. |
| frameElement | Возвращает элемент (например iframe или object), в который встроено окно, или null, если это окно верхнего уровня. |
| frames | Возвращает массив-подобный объект, который представляет все iframe элементы в текущем окне. |
| innerHeight | Возвращает значение высоты видимой рабочей области окна браузера. |
| innerWidth | Возвращает значение ширины видимой рабочей области окна браузера. |
| length | Возвращает количество iframe-элементов на странице. |
| name | Устанавливает или возвращает имя окна |
| opener | Возвращает ссылку на окно, которое создало окно |
| outerWidth | Возвращает внешнюю ширину окна |
| outerHeight | Возвращает внешнюю высоту окна |
| pageXOffset | Возвращает количество пикселей, на которые документ был прокручен в горизонтальном направлении относительного левого верхнего угла окна |
| pageYOffset | Возвращают количество пикселей, на которые документ был прокручен в вертикальном направлении относительного левого верхнего угла окна |
| parent | Возвращает родительское окно текущего окна |
| screenLeft | Возвращает горизонтальную координату окна относительно экрана |
| screenTop | Возвращает вертикальную координату окна относительно экрана |
| screenX | Возвращает горизонтальную координату окна относительно экрана |
| screenY | Возвращает вертикальную координату окна относительно экрана |
| self | Возвращает текущее окно |
| top | Возвращает верхнее окно браузера |
Методы
| alert() | Отображает окно предупреждения с сообщением и кнопкой ОК |
| atob() | Декодирует строку, закодированную с помощью метода btoa |
| blur() | Удаляет фокус из текущего окна |
| btoa() | Зашифровывает строку в строку base-64 |
| clearInterval() | Очищает таймер , установленный с setInterval() |
| clearTimeout() | Очищает таймер , установленный с setTimeout() |
| close() | Закрывает текущее окно |
| confirm() | Отображает диалоговое окно с сообщением и ОК и кнопку Отмена |
| focus() | Устанавливает фокус на текущее окно |
| matchMedia() | Возвращает объект MediaQueryList, представляющий результаты указанной строки мультимедийного запроса CSS. |
| moveBy() | Перемещение окна относительно его текущего положения |
| moveTo() | Перемещение окна в заданное положение |
| open() | Открывает новое окно браузера |
| print() | Печатает содержимое текущего окна |
| prompt() | Отображает диалоговое окно с указанным текстом и полем для пользовательского ввода |
| resizeBy() | Изменение размера окна на указанное количество пикселей относительно его текущего размера. |
| resizeTo() | Изменение размера окна до заданной ширины и высоты |
| scrollBy() | Прокрутка документ на указанное число пикселей |
| scrollTo() | Прокрутка документа для заданных координат |
| setInterval() | Вызывает функцию или вычисляет выражение через заданные интервалы времени |
| setTimeout() | Вызывает функцию или вычисляет выражение после определенного количества миллисекунд |
| stop() | Остановки окна от нагрузки |
closed
С помощью свойства closed Вы можете узнать о текущем состояния окна.
Синтаксис
window.closed
Возвращаемое значение
Данное свойство возвращает true если указанное окно было закрыто и false если оно открыто в данный момент.
Примеры
Функция , которая проверяет , является ли окно под названием "myWindow" было закрыто или нет:
function checkWin() {
if (!myWindow) {document.getElementById("msg").innerHTML = "'myWindow' has never been opened!";}
else {
if (myWindow.closed) { document.getElementById("msg").innerHTML = "'myWindow' has been closed!";}
else {document.getElementById("msg").innerHTML = "'myWindow' has not been closed!";}
}
}
frameElement
Свойство frameElement аозвращает элемент (например iframe или object), в который встроено окно, или null, если это окно верхнего уровня.
Синтаксис
window.frameElement
Пример
var frameEl = window.frameElement;
// Если мы внутри фрейма, то изменить его URL на 'http://mozilla.org/'
if (frameEl) {
frameEl.src = 'http://mozilla.org/';
}
frames
Свойство frames возвращает массив-подобный объект, который представляет все iframe элементы в текущем окне.
Синтаксис
window.frames
Примеры
var frames = window.frames; // or // var frames = window.parent.frames;
for (var i = 0; i < frames.length; i++) {
// do something with each subframe as frames[i]
frames[i].document.body.style.background = "red";
}
Изменение расположения первого iframe элемента (index 0) в текущем окне:
window.frames[0].location = "http://www.my.com/jsref";
innerHeight
Свойство innerHeight предназначено для получения значения высоты видимой рабочей области окна браузера, в которой отображается HTML-документ. Эти свойства доступны только для чтения и возвращают значения в пикселях.
Синтаксис
window.innerHeight
Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| 1,0 | 9,0 | 1,0 | 3,0 | 9,0 |
Комментарии
Для IE8 и ранее, вы можете использовать свойство clientHeight
Если есть полоса прокрутки, clientHeight возвращает именно ширину внутри неё, доступную для документа, а innerHeight – игнорируют её наличие.
Примеры
var w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; var h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight; var t = w + ' x ' + h + '\n'; w = document.documentElement.clientWidth || document.body.clientWidth; h = document.documentElement.clientHeight || document.body.clientHeight; Alert (t+w + ' x ' + h);
innerWidth
Свойство innerWidth предназначено для получения значения ширины видимой рабочей области окна браузера, в которой отображается HTML-документ. Это свойство доступны только для чтения и возвращают значения в пикселях.
Синтаксис
window.innerWidth
Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| 1,0 | 9,0 | 1,0 | 3,0 | 9,0 |
Комментарии
Для IE8 и ранее, вы можете использовать свойство clientWidtht
Если есть полоса прокрутки, clientWidth возвращает именно высоту внутри неё, доступную для документа, а innerWidth – игнорируют её наличие.
Примеры
var w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; var h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight; var t = w + ' x ' + h + '\n'; w = document.documentElement.clientWidth || document.body.clientWidth; h = document.documentElement.clientHeight || document.body.clientHeight; Alert (t+w + ' x ' + h);
length
Свойство length возвращает количествоiframe элементов на странице.
Синтаксис
window.length
Пример
var frames = window.frames;
var i;
for (i = 0; i < frames.length; i++) {
frames[i].location = "http://www.my.com";
}
name
С помощью свойства name Вы можете установить или узнать имя текущего окна браузера.
окно.name окно.name = strName
Примеры
//Создадим новое окно win с именем 'Новое окно'
win = window.open('','Новое окно','width=200,height=100');
//Выведем название нового окна на страницу
Alert (win.name);
// изменим имя окна
win.name = "myWindowName";
Alert (win.name);
opener
Свойство opener возвращает ссылку на окно, которое открыло текущее.
Синтаксис
окно.opener
Возвращаемое значение
Ссылка на окно, которое создало окноКомментарии
Когда Вы открываете новое окно с помощью open() Вы можете воспользоваться этим свойством, чтобы взаимодействовать с родительским окном из нового окна.
Пример
//Создадим новое окно win
win = window.open('','newwin','width=200,height=100');
//Выведем в новое окно текст
win.document.write("Текст нового окна");
//Теперь выведем текст в родительское окно с помощью свойства opener
win.opener.document.getElementById("opener1").innerHTML="Текст родительского окна";
outerWidth
Свойство outerWidth возвращает внешнюю ширину окна, в том числе всех элементов интерфейса ( панели инструментов, полосы прокрутки, строку состояния, границы окна и т.д. )
Синтаксис
window.outerWidth
Возвращаемое значение
Свойство outerWidth доступно только для чтения и возвращает ширину окна в пикселях.Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| 1,0 | 9,0 | 1,0 | 3,0 | 9,0 |
Примеры
Демонстрация innerWidth, innerHeight, outerWidth и outerHeight в одном примере:
var txt = ""; txt += "innerWidth: " + window.innerWidth + "\n"; txt += "innerHeight: " + window.innerHeight + "\n"; txt += "outerWidth: " + window.outerWidth + "\n"; txt += "outerHeight: " + window.outerHeight; Akert (txt);
outerHeight
Свойство outerHeight возвращает внешнюю высоту окна, в том числе всех элементов интерфейса ( панели инструментов, полосы прокрутки, строку состояния, границы окна и т.д. )
Синтаксис
window.outerHeight
Возвращаемое значение
Свойство outerHeight доступно только для чтения и возвращает высоту окна в пикселях.Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| 1,0 | 9,0 | 1,0 | 3,0 | 9,0 |
Примеры
Демонстрация innerWidth, innerHeight, outerWidth и outerHeight в одном примере:
var txt = ""; txt += "innerWidth: " + window.innerWidth + "\n"; txt += "innerHeight: " + window.innerHeight + "\n"; txt += "outerWidth: " + window.outerWidth + "\n"; txt += "outerHeight: " + window.outerHeight; Akert (txt);
pageXOffset
Свойство pageXOffset предназначено для получения количества пикселей, на которые документ был прокручен в горизонтальном направлении относительного левого верхнего угла окна.
Синтаксис
window.pageXOffset
Комментарии
Свойство pageXOffset равно свойству scrollX
Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| Да | 9,0 | Да | Да | Да |
Для IE8 и ранее, можно использовать "document.documentElement.scrollLeft"
// Кросс-браузерное решение
var left = window.pageXOffset || document.documentElement.scrollLeft;
var top = window.pageYOffset || document.documentElement.scrollTop;
Akert ("pageXOffset = " + left + "\npageYOffset = " + top);
pageYOffset
Свойство pageYOffset предназначено для получения количества пикселей, на которые документ был прокручен в вертикальном направлении относительного левого верхнего угла окна.
Синтаксис
window.pageYOffset
Комментарии
Свойство pageYOffset равно свойству scrollY
Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| Да | 9,0 | Да | Да | Да |
Для IE8 и ранее, можно использовать "document.documentElement.scrollTop"
// Кросс-браузерное решение
var left = window.pageXOffset || document.documentElement.scrollLeft;
var top = window.pageYOffset || document.documentElement.scrollTop;
Akert ("pageXOffset = " + left + "\npageYOffset = " + top);
parent
Свойство parent возвращает родительское окно текущего окна.
Синтаксис
window.parent
Примеры
<!DOCTYPE HTML>
<html><head>
<script type='text/javascript'>
//Определяем функцию openw которая будет вызываться после нажатия на кнопку
function openw()
{
//Создадим новое окно win
win = window.open("", "newWin", "width=700, height=100");
//Выведем в новое окно адрес родительского окна
win.document.write(parent.location.href);
}
</script>
</head>
<body>
<input type='button' value='Открыть окно win' onclick='openw()' >
<br /><br />
</body></html>
screenLeft
Свойства screenLeft и screenTop предназначены для получения координаты левого верхнего угла окна браузера или документа относительно левого верхнего угла экрана пользователя.
Синтаксис
window.screenLeft
Возвращаемое значение
Свойство screenleft доступно только для чтения и возвращает значение расстояния относительно левого угла экрана по горизонтали в пикселях.
Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| Да | Да | Нет | Да | Да |
Для Firefox, используйте « window.screenX »
// Кросс-браузерное решение
// Получаем координаты расположения окна (документа) во всех браузерах
winX = window.screenX ? window.screenX : window.screenLeft;
winY = window.screenY ? window.screenY : window.screenTop;
Alert ("Координаты окна относительно экрана пользователя: X = " + winX + ", Y = " + winY + ".");
screenTop
Свойства screenLeft и screenTop предназначены для получения координаты левого верхнего угла окна браузера или документа относительно левого верхнего угла экрана пользователя.
Синтаксис
window.screenTop
Возвращаемое значение
Свойство screenTop доступно только для чтения и возвращает значение расстояния относительно левого угла экрана по вертикали в пикселях.
Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| Да | Да | Нет | Да | Да |
Для Firefox, используйте « window.screenY »
// Кросс-браузерное решение
// Получаем координаты расположения окна (документа) во всех браузерах
winX = window.screenX ? window.screenX : window.screenLeft;
winY = window.screenY ? window.screenY : window.screenTop;
Alert ("Координаты окна относительно экрана пользователя: X = " + winX + ", Y = " + winY + ".");
screenX
Свойства screenX и screenY предназначены для получения координаты левого верхнего угла окна браузера или документа относительно левого верхнего угла экрана пользователя.
Синтаксис
window.screenX
Возвращаемое значение
Свойство screenX доступно только для чтения и возвращает значение расстояния относительно левого угла экрана по горизонтали в пикселях.
Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| Да | 9,0 | Да | Да | Да |
// Кросс-браузерное решение
// Получаем координаты расположения окна (документа) во всех браузерах
winX = window.screenX ? window.screenX : window.screenLeft;
winY = window.screenY ? window.screenY : window.screenTop;
window.alert ("Координаты окна относительно экрана пользователя: X = " + winX + ", Y = " + winY + ".");
screenY
Свойства screenX и screenY предназначены для получения координаты левого верхнего угла окна браузера или документа относительно левого верхнего угла экрана пользователя.
Синтаксис
window.screenY
Возвращаемое значение
Свойство screenY доступно только для чтения и возвращает значение расстояния относительно левого угла экрана по вертикали в пикселях.
Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| Да | 9,0 | Да | Да | Да |
// Кросс-браузерное решение
// Получаем координаты расположения окна (документа) во всех браузерах
winX = window.screenX ? window.screenX : window.screenLeft;
winY = window.screenY ? window.screenY : window.screenTop;
window.alert ("Координаты окна относительно экрана пользователя: X = " + winX + ", Y = " + winY + ".");
self
Свойство self возвращает текущее окно
Синтаксис
window.self
// или
self
Возвращаемое значение
Ссылка на сам объект Window
Примеры
alert ( self.location );
top
Свойство top возвращает самое верхнее в иерархии окно в текущем окне браузера.
Синтаксис
window.top // или top
Возвращаемое значение
Ссылка на самое верхнее окно в иерархии окна
Примеры
<script> //Отобразим адрес самого верхнего в иерархии окна в текущем окне браузера document.write(top.location.href+'
'); /* Отобразим адрес текущего окна (т.к результат выполнения кода отображается во фрейме он и является текущим окном) */ document.write(location.href); </script>
alert()
Метод alert выводит модальное окно с сообщением.
Синтаксис
alert(message)
Аргументы
- message
- Текст сообщения
Описание, примеры
Выводит модальное окно с сообщением. Посетитель не сможет продолжить работу, пока не нажмет на кнопку "ОК" в модальном окне.
alert('Добрый день')
atob()
Метод atob декодирует строку, закодированную с помощью метода btoa, т.е. он возвращает исходную строку.
Синтаксис
window.atob( encodedStr )
Параметры
- encodedStr
- Строка, которую нужно декодировать.
Возвращаемое значение
Строка, представляющая декодированную строку
Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| Да | 10,0 | Да | Да | Да |
Примеры
Alert ( atob ("SGVsbG8gV29ybGQh") );
blur()
Метод blur делает текущее окно неактивным.
Синтаксис
window.blur()
Комментарии
Этот метод делает запрос , чтобы перевести текущее окно на задний план. Он не может работать, как вы ожидаете, во всех браузерах, из-за различных пользовательских настроек.
Примеры
//Создадим новое окно win
win = window.open("", "newWib", "width=200, height=100");
//Отобразим в новом окне произвольный текст
win.document.write("Я новое окно");
//Заставим новое окно открыться в фоне (сделаем его неактивным)
win.blur();
btoa()
Метод btoa предназначен для кодирования строки, указанной в качестве параметра в ACSII строку base-64.
Синтаксис
window.btoa( str )
Параметры
- str
- Строка, которая будет закодирована
Возвращаемое значение
Строка, представляющая базовый 64 закодированную строку
Описание, комментарии, примеры
Метод btoa предназначен для кодирования строки, указанной в качестве параметра в ACSII строку base-64, которая будет представлена с помощью 64 символов: "A-Z", "a-z", "0-9", "+", "/" и "=". Кодирование Base64 может используется для визуального скрытия данных от пользователя, для передачи информации и др. Принцип работы метода заключается в том, что он сначала преобразуют строку в последовательность бит, которые затем на основе схемы base-64 преобразуются в закодированную строку
var txt = "I Love JavaScript!"; var result = "Исходная строка: " + txt + '\n'; var encode = window.btoa(txt); var result = "Закодированная строка: " + encode; Alert (result);
Если в качестве параметра метода btoa будет использоваться строка Unicode, то может произойти исключение, из-за того что данная строка может содержать символы вне диапазона.
Чтобы этого не допустить, можно использовать следующие функции:
//кодирование строки Unicode в base-64
function utf8_to_b64(str) {return window.btoa(unescape(encodeURIComponent(str)));}
//декодирование строки из base-64 в Unicode
function b64_to_utf8(str) {return decodeURIComponent(escape(window.atob(str)));}
var s = utf8_to_b64 ( "\nИспользуем метод «btoa»" );
s += b64_to_utf8( s );
Alert (s);
Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| Да | 10,0 | Да | Да | Да |
clearInterval()
Метод clearInterval останавливает выполнение кода, заданное setInterval
Синтаксис
clearInterval(intervalID)
Аргументы
- intervalID
- Идентификатор, возвращенный setInterval
При передаче некорректного intervalID не инициирует ошибку.
clearTimeout()
Метод clearTimeout отменяет выполнение кода, заданное setTimeout
Синтаксис
clearTimeout(timeoutID)
Аргументы
- timeoutID
- идентификатор, возвращенный setTimeout
Отменяет выполнение кода.
При передаче несуществующего или уже выполненного timeoutID - ничего не происходит, исключение не генерируется.
timeoutID = setTimeout(...) ... clearTimeout(timeoutID)
close()
Метод close позволяет закрыть указанное окно браузера.
Синтаксис
окно.close()
// или
close()
Примеры
myWindow = window.open("", "myWindow", "width=200, height=100");
alert ("Закрыть окно");
myWindow.close();
confirm()
Метод confirm выводит сообщение в окне с двумя кнопками: "ОК" и "ОТМЕНА" и возвращает выбор посетителя
Синтаксис
result = confirm(message)
Аргументы
- message
- Текст сообщения
Выводит сообщение в окне с двумя кнопками: "ОК" и "ОТМЕНА".
Возвращает true/false в зависимости от того, куда нажмет посетитель.
Как и alert, окно - модальное, то есть посетитель не может делать ничего другого, пока не выберет одну из кнопок.
if (confirm("Сказать привет?")) {
alert("Привет!")
} else {
alert("Вы нажали кнопку отмена")
}
Как правило, вызов confirm используется в простейших скриптах, т.к. окно вопроса к посетителю нельзя стилизовать.
Сложные интерфейсы обычно стремятся выводить более красивые окошки посетителям, поэтому делают это по-другому, через DOM-элемент, без вызова confirm.
focus()
Метод focus делает текущее окно активным.
Синтаксис
окно.focus()
// или
focus()
Комментарии
Используйте blur, чтобы удалить фокус из текущего окна.
Этот метод делает запрос , чтобы перевести текущее окно на задний план. Он не может работать, как вы ожидаете, во всех браузерах, из-за различных пользовательских настроек.
Примеры
//Создадим новое окно win
win = window.open("", "myWindow", "width=400, height=100");
//Отобразим в новом окне произвольный текст
win.document.write("Я новое окно");
//Заставим новое окно открыться на переднем плане (установим на него фокус)
win.focus();
matchMedia()
Метод window.matchMedia () возвращает объект MediaQueryList, представляющий результаты указанной строки мультимедийного запроса CSS.
Значением метода matchMedia () может быть любая из мультимедийных функций правила CSS @media , например min-height, min-width, ориентация и т. Д.
Объект MediaQueryList имеет два свойства и два метода:
- matches
- Используется для проверки результатов запроса. Возвращает логическое значение:
true, если документ соответствует списку медиазапросов, в противном случае -false. - media
- Строка, представляющая сериализованный список медиа-запросов
- addListener(functionref)
- Добавляет новую функцию слушателя, которая выполняется всякий раз, когда изменяется оцененный результат медиазапроса
- removeListener(functionref)
- Удаляет ранее добавленную функцию слушателя из списка медиазапросов. Ничего не делает, если указанного слушателя еще нет в списке
Синтаксис
window.matchMedia(mediaQueryString)mediaQueryString Строка, представляющая медиа-запрос, для которого нужно вернуть новый объект MediaQueryList
Примеры
<!DOCTYPE html>
<html>
<body>
<p> Нажми кнопку, чтобы узнать, имеет ли экран/область просмотра ширину менее 700 пикселей или более.</p>
<button onclick="myFunction()">Попробуй</button>
<p id="demo"></p>
<script>
function myFunction() {
var x = document.getElementById("demo");
if (window.matchMedia("(max-width: 700px)").matches) {
x.innerHTML = "Экран меньше или равен 700 пикселям в ширину.";
} else {
x.innerHTML = "Ширина экрана не менее 700 пикселей.";
}
}
</script>
</body>
</html>
Нативный метод window.matchMedia позволяет реализовать media-запросы для поиска ориентации устройства:
var mql = window.matchMedia("(orientation: portrait)");
if(mql.matches) {
// Портретная ориентация
} else {
// Горизонтальная ориентация
}
// Прослушка события изменения ориентации
mql.addListener(function(m) {
if(m.matches) {
// Изменено на портретный режим
}
else {
// Изменено на горизонтальный режим
}
});
moveBy()
С помощью метода moveBy Вы можете передвинуть окно в любом направлении на указанное количество пикселей.
Синтаксис
окно.moveBy( x,y )
// или
moveBy( x,y )
Параметры
- x
- Положительное или отрицательное число, которое задает количество пикселей, чтобы переместить окно по горизонтали
- y
- Положительное или отрицательное число, которое задает количество пикселей для перемещения окна по вертикали
Примеры
//Создадим новое окно win шириной 300 пикселей и высотой 100 пикселей
win = window.open('', 'newWin', 'width=300,height=100');
//Отобразим в новом окне произвольный текст
win.document.write('Я новое окно');
alert ( "Переместить окно" );
win.moveBy(200,100);
win.focus();
moveTo()
Метод moveTo позволяет переместить окно на указанное место.
Синтаксис
окно.moveTo( x,y ) // или moveTo( x,y )
Параметры
- x
- Указывает координату, на которую будет перемещен верхний левый угол окна по оси x (по горизонтали).
- y
- Указывает координату, на которую будет перемещен верхний левый угол окна по оси y (по вертикали).
Примеры
//Создадим новое окно win шириной 300 пикселей и высотой 100 пикселей
win = window.open('','newWin','width=300,height=100');
//Отобразим в новом окне произвольный текст
win.document.write('Я новое окно');
alert ( "Переместить окно" );
win.moveTo(500,400);
win.focus();
open()
С помощью метода open Вы можете открыть новое окно браузера.
Синтаксис
окно.open(URL,name,параметры)
// или
open(URL,name,параметры)
Примеры
- URL
- Является не обязательным параметром. Указывает
URLстраницы, которая будет открыта в окне. Если данный параметр отсутствует окно будет открыто пустым. - name
- Является не обязательным параметром. Указывает способ открытия или имя окна. Возможные значения:
- имя устанавливает имя окна
- _blank URL загружается в новом окне
- _parent URL загружается в родительском фрейме
- _self URL заменяет текущую страницу
- _top URL заменяет все фреймы, которые могут быть загружены
- параметры
- Является не обязательным параметром. Параметры отделенные запятой, без каких-либо пробелов. Доступны следующие параметры:
- width =
число- Ширина окна в пикселах (не менее 100 ) - height =
число- Высота окна в пикселах (не менее 100 ) - left =
число- Расстояние от левого края экрана до левой границы окна в пикселах - top =
число- Расстояние от верхнего края экрана до верхней границы окна в пикселах - directories =
yes|no- Наличие у окна панели папок (Netscape Navigator) - location =
yes|no- Наличие у окна поля адреса - menubar =
yes|no- Наличие у окна панели меню - resizable =
yes|no- Сможет ли пользователь менять размер окна - scrollbars =
yes|no- Наличие у окна полос прокрутки - status =
yes|no- Наличие у окна поля статуса - toolbar =
yes|no- Наличие у окна панели инструментов
- width =
Примеры
window.open("https://www.mail.ru",
"_blank",
"toolbar=yes,scrollbars=yes,resizable=yes,top=20,left=50,width=900,height=500");
С помощью метода print Вы можете распечатать содержимое текущего окна.
Синтаксис
window.print()
Описание
Метод print открывает диалоговое окно Print, которая позволяет пользователю выбрать предпочтительные параметры печати.
Примеры
//Распечатаем содержимое окна print();
prompt()
Метод выводит окно с указанным текстом и полем для пользовательского ввода.
Синтаксис
result = prompt(text[, value])
Аргументы
- text
- Текст сообщения
- value
- Строка, введенная в текстовое поле по умолчанию. Необязательный параметр.
Выводит сообщение в окне с текстовым полем и двумя кнопками: "ОК" и "ОТМЕНА".
Возвращает введенное значение или null, если посетитель нажал на кнопку "ОТМЕНА".
Как и в alert, окно - модальное, то есть посетитель не может делать ничего другого, пока не выберет одну из кнопок.
var years=prompt('Сколько вам лет?',100)
Alert('Вам '+years+' лет!')
resizeBy()
Метод resizeBy предназначен для изменения окна на указанное количество пикселей относительно его текущего размера.
Синтаксис
окно.resizeBy(width, height) // или resizeBy(width, height)
Параметры
- width
- увеличивает или уменьшает ширину окна браузера на указанное количество пикселей
- height
- увеличивает или уменьшает высоту окна браузера на указанное количество пикселей
Примеры
//Создадим новое окно win шириной 300 пикселей и высотой 100 пикселей
win = window.open('','newWin','width=700,height=100');
//Отобразим в новом окне произвольный текст
win.document.write('Я новое окно');
alert ( "Переместить и изменить размеры" );
win.moveTo(200,200);
win.resizeBy (-500,100);
win.focus();
resizeTo()
Метод resizeTo изменяет ширину и высоту окна на указанные значения.
Синтаксис
окно.resizeTo(width, height) // или resizeTo(width, height)
Параметры
- width
- устанавливает ширину окна браузера в пикселях
- height
- устанавливает высоту окна браузера в пикселях
Примеры
//Создадим новое окно win шириной 300 пикселей и высотой 100 пикселей
win = window.open('','newWin','width=300,height=100');
//Отобразим в новом окне произвольный текст
win.document.write('Я новое окно');
alert ( "Переместить и изменить размеры" );
win.moveTo(200,200);
win.resizeTo (500,300);
win.focus();
scrollBy()
Метод scrollBy предназначен для прокрутки документа вверх или вниз и влево или вправо на определённое количество пикселей относительно его текущего положения.
Синтаксис
окно.scrollBy( x,y ) // или scrollBy( x,y )
Параметры
- x
- Количество пикселей, на которое будет прокручено содержимое окна по горизонтали. Положительные значения будут прокручиваться влево, а отрицательные значения будут прокручивать вправо
- y
- Количество пикселей, на которое будет прокручено содержимое окна по вертикали. Положительные значения будут прокручиваться вниз, в то время как отрицательные значения прокрутки вверх
Примеры
alert ('Прокрутить содержимое окна вверх');
scrollBy(0,-200);
alert ('Прокрутить содержимое окна вниз');
scrollBy(0,200);
scrollTo()
Метод scrollTo предназначен для прокрутки документа в горизонтальном и вертикальном направлении на указанное количество пикселей.
Синтаксис
окно.scrollTo(x,y) // или scrollTo(x,y)
Параметры
- x
- Координата вдоль оси X, до которой необходимо прокрутить документ в горизонтальном направлении.
- y
- оордината вдоль оси Y, до которой необходимо прокрутить документ в вертикальном направлении.
Примеры
scrollTo(0,100)
setInterval()
Метод setInterval выполняет код или функцию через указанный интервал времени
Синтаксис
intervalID = window.setInterval(func|code, delay)
Аргументы
- func|code
- Функция или строка кода для выполнения
- delay
- Интервал в миллисекундах, т.е 1000 это 1 секунда
В отличие от метода setTimeout, setInterval выполняет код много раз, через равные промежутки времени, пока не будет остановлен при помощи clearInterval.
В каком виде указывать первый параметр - разницы нет.
При указании строки кода - динамически создается функция с телом code.
Следующие два вызова почти одинаковы:
// (1)
setInterval('Alert("прошла секунда")', 1000)
// (2)
function sec() {
Alert("прошла секунда")
}
setInterval(sec, 1000) // использовать функцию
Но более правильным считается объявление функции в явном виде, например так:
setInterval(function() { alert(...) }, 1000)
Вызов со строкой существует для совместимости с прежними версиями javascript.
Отмена выполнения
Вы можете отменить выполнение setInterval при помощи clearInterval, используя для этого идентификатор intervalID.
var intervalID = setInterval(...) clearInterval(intervalID)
setTimeout()
Метод setTimeout выполняет код или функцию после указанной задержки
Синтаксис
timeout_id = setTimeout(func|code, delay)
Аргументы
- func|code
- Функция или строка кода для выполнения
- delay
- Задержка в миллисекундах, т.е 1000 это 1 секунда
Этот метод выполняет код(или функцию), указанный в первом аргументе, асинхронно, с задержкой в delay миллисекунд.
В отличие от метода setInterval, setTimeout выполняет код только один раз.
В каком виде указывать первый параметр - в виде строки кода или функции - разницы нет.
Следующие два вызова работают одинаково:
// первый аргумент - строка
setTimeout('Alert("прошла секунда")', 1000)
// первый аргумент - функция
function second_passed() {
Alert("прошла секунда")
}
setTimeout(second_passed, 1000)
При указании строки кода - интерпретатор динамически создает анонимную функцию с телом из данной строки. Но более правильным считается объявление функции в явном виде, например так:
setTimeout(function() { Alert('0.5 секунды') }, 500)
Вызов со строкой существует для совместимости с прежними версиями javascript.
Отмена выполнения
Вы можете отменить выполнение setTimeout при помощи clearTimeout, используя для этого идентификатор таймаута.
var timeout_id = setTimeout(...) clearTimeout(timeout_id)
Пример: Рабочий пример
<input type="button" onclick="on()" value="Запустить таймаут"/>
<input type="button" onclick="off()" value="Остановить отсчет"/>
<script>
function go() { Alert('Ваше время истекло'); }
function on() { timeoutId = setTimeout(go, 3000); }
function off() { clearTimeout(timeoutId); }
</script>
Минимальная задержка
Минимально возможная задержка в разных браузерах варьируется. В среднем составляет 12 мс. То есть, разницы между setTimeout(.., 1) и setTimeout(.., 12), как правило, нет.
Производительность
Большое количество таймеров может привести к серьезной нагрузке на процессор.
Это в первую очередь касается приложений, в которых одновременно анимируется большое количество объектов. В этом случае, по возможности, следует использовать один таймер, который выполняет всю анимацию, а не множество независимых.
stop()
Метод stop останавливает загрузку окна.
Этот метод может быть полезным, если загрузка изображения или кадра занимает слишком много времени.
Синтаксис
window.stop()
Совместимость с браузерами
![]() | ![]() | ![]() | ![]() | ![]() |
| Да | Нет | Да | Да | Да |




