The window
object represents the window that contains the DOM document.
window.document
points to the document
object loaded in the window.
Properties and methods of this object can be called without referencing window
explicitly, because it represents the global object. So, the previous property window.document
is usually called just document
.
Properties
Here is a list of useful properties you will likely reference a lot:
console
points to the browser debugging console. Useful to print error messages or logging, usingconsole.log
,console.error
and other tools (see the Browser DevTools article)document
as already said, points to thedocument
object, key to the DOM interactions you will performhistory
gives access to the History APIlocation
gives access to the Location interface, from which you can determine the URL, the protocol, the hash and other useful information.localStorage
is a reference to the Web Storage API localStorage objectsessionStorage
is a reference to the Web Storage API sessionStorage object
Methods
The window
object also exposes useful methods:
alert()
: which you can use to display alert dialogspostMessage()
: used by the Channel Messaging APIrequestAnimationFrame()
: used to perform animations in a way that’s both performant and easy on the CPUsetInterval()
: call a function every n milliseconds, until the interval is cleared withclearInterval()
clearInterval()
: clears an interval created withsetInterval()
setTimeout()
: execute a function after ‘n’ millisecondssetImmediate()
: execute a function as soon as the browser is readyaddEventListener()
: add an event listener to the documentremoveEventListener()
: remove an event listener from the document
See the full reference of all the properties and methods of the window
object at https://developer.mozilla.org/en-US/docs/Web/API/Window
Lessons in this unit:
0: | Introduction |
1: | ▶︎ The `window` object |
2: | The `document` object |
3: | Types of nodes |
4: | Traversing the DOM |
5: | Editing the DOM |