В чем разница между окном, экраном и документом в Javascript?

Я вижу, что эти термины используются взаимозаменяемо как глобальная среда для DOM. В чем разница (если есть), и когда я должен использовать каждый из них?

ОТВЕТЫ

Ответ 1

Window является основным корнем объекта JavaScript, который является глобальным объектом в браузере, также может рассматриваться как корень объектной модели документа. Вы можете получить к нему доступ как Window в большинстве случаев (в браузере);

window.screen - это небольшой информационный объект о физических размерах экрана.

window.document или просто document является основным объектом видимой (или лучше еще: визуализированной) объектной модели документа/DOM.

Ответ 2

Ну, окно - это первое, что загружается в браузер. Этот объект окна имеет большинство свойств, таких как length, innerWidth, innerHeight, name, если он был закрыт, его родители и т.д.

Как насчет объекта документа? Объектом документа является ваш html, aspx, php или другой документ, который будет загружен в браузер. Документ фактически загружается внутри объекта окна и имеет доступные ему свойства, такие как заголовок, URL, cookie и т.д. Что это значит? Это означает, что если вы хотите получить доступ к свойству для окна, то это window.property, если это документ, это window.document.property, который также доступен короче как document.property.

dom

Это кажется достаточно простым. Но что происходит, когда вводится IFRAME?

iframe

Ответ 3

window - это фактический глобальный объект.

screen - это экран, он содержит свойства пользовательского дисплея.

document находится где DOM.

Ответ 4

Вкратце, с более подробной информацией ниже,

  • window - это контекст выполнения и глобальный объект для этого контекста. JavaScript
  • document содержит DOM, инициализированный при разборе HTML
  • screen описывает физическое отображение на весь экран

См. Ссылки на W3C и Mozilla для получения подробной информации об этих объектах. Основное соотношение между тремя заключается в том, что каждая вкладка браузера имеет свое собственное window, а window имеет свойства window.document и window.screen. На вкладке браузера window является глобальным контекстом, поэтому document и screen, обратитесь к window.document и window.screen. Более подробная информация о трех объектах приведена ниже, после Flanagan JavaScript: Полное руководство.

window

Каждая вкладка браузера имеет свой собственный объект window верхнего уровня. Каждый элемент <iframe> (и устаревший <frame>) также имеет свой собственный объект window, вложенный в родительское окно. Каждое из этих окон получает свой отдельный глобальный объект. window.window всегда ссылается на window, но window.parent и window.top могут ссылаться на window.top окна, предоставляя доступ к другим контекстам выполнения. В дополнение к document и screen описанным ниже, свойства window включают

  • setTimeout() и setInterval() привязывают обработчики событий к таймеру
  • location дающее текущий URL
  • history с методами back() и forward() предоставляющими изменяемую вкладку истории
  • navigator описывающий программное обеспечение браузера

document

У каждого объекта window есть объект document который будет представлен. Эти объекты частично запутываются, потому что HTML-элементы добавляются в глобальный объект при назначении уникального идентификатора. Например, во фрагменте HTML

<body>
  <p id="holyCow"> This is the first paragraph.</p>
</body>

На элемент абзаца можно ссылаться любым из следующих:

  • window.holyCow или window["holyCow"]
  • document.getElementById("holyCow")
  • document.body.firstChild
  • document.body.children[0]

screen

У window объекта также есть screen объект со свойствами, описывающими физическое отображение:

  • Свойства экрана: width и height - полный экран

  • Свойства экрана. availWidth и availHeight опустить панель инструментов.

Часть экрана, отображающая визуализированный документ, является областью просмотра в JavaScript, что может сбивать с толку, поскольку мы называем часть экрана приложения окном, когда говорим о взаимодействии с операционной системой. Метод getBoundingClientRect() любого элемента document возвращает объект со свойствами top, left, bottom и right описывающими расположение элемента в области просмотра.

Ответ 5

window содержит все, поэтому вы можете вызвать window.screen и window.document, чтобы получить эти элементы. Проверьте эту скрипту, довольно-печатайте содержимое каждого объекта: http://jsfiddle.net/JKirchartz/82rZu/

Вы также можете увидеть содержимое объекта в инструментах firebug/dev, например:

console.dir(window);
console.dir(document);
console.dir(screen);

window - это корень всего, screen просто имеет размер экрана, а document - это верхний объект DOM. поэтому вы можете думать об этом как window как супер-document...

Ответ 6

Окно - это первое, что загружается в браузер. Этот объект окна имеет большинство свойств, таких как length, innerWidth, innerHeight, name, если он был закрыт, его родители и т.д.

Объектом document является ваш html, aspx, php или другой документ, который будет загружен в браузер. Документ фактически загружается внутри объекта окна и имеет доступные ему свойства, такие как заголовок, URL, cookie и т.д. Что это значит? Это означает, что если вы хотите получить доступ к свойству для окна, то это window.property, если это документ, это window.document.property, который также доступен короче как document.property.