Wird in JavaScript eine innere Funktion innerhalb einer äusseren Funktion definiert, erhält die innere Funktion Zugriff auf die Variablen der äusseren Funktion. Damit können globale Variablen umgangen werden, und man nutzt stattdessen die lokalen Variablen einer einzigen äusseren Funktion.

Allerdings können dann im HTML-Code keine Funktionen direkt aufgerufen werden, sondern die Event-Handler müssen vom JavaScript-Code den Element hinzugefügt werden.

In depth: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures

Hinweis:

Der load Event vom window ist nicht unbedingt die effizienteste, aber die einfachste Lösung. Gewisse Dinge könnten schon erledigt werden, wenn das DOM geladen ist (load Event vom document). Es kann aber sein, dass dieser Event feuert, bevor der Handler registriert wurde, was dann dazu führt, dass der Code nicht ausgeführt wird.