The Old NetISSUE #30 of 60

window object · the global container

Pixel PeteVSQuirks Mode

Pixel Pete saysThe window object is the global container — the page (document) lives inside it.

window is the browser's global scope and the top of the object hierarchy: it holds document, location, navigator, setTimeout, and your global variables. In DHTML you use it for viewport size, timers, and dialogs. Because it's global, window.alert and bare alert are the same call.

Power-ups you unlock

window = global scope, top of the hierarchy
Holds document, location, timers, globals
Viewport size, timers, dialogs
window.x and bare x are the same

Quirks Mode attacks — common mistakes

Confusing window (global) with document (page)
Polluting the global window namespace
Relying on blocking window.alert in real UIs

Boss battleRead the viewport size from window and set a timer with setTimeout.

Example code

<!doctype html><html><head><meta charset="utf-8"></head>
<body style="background:#06040d;color:#e6e0ff;font-family:monospace;padding:20px"><pre id="o"></pre>
<script>document.getElementById('o').textContent='viewport: '+window.innerWidth+'×'+window.innerHeight;</script></body></html>

▶ Open the interactive comic issue

‹ Document Object · Entry To The Dom Accessing Elements · GetElementById · GetElementsByTagName ›