outer = 10;

function init() {
                                                                   
   document.getElementById("a1").onclick = function() { alert(outer); return false; };

   inner = outer;                                                                   
   document.getElementById("a2").onclick = function() { alert(inner); return false;};

   outer++;   
   document.getElementById("a3").onclick = function() { alert(outer); return false; };

	// create some items
   items = new Array();
   for(i=0; i<4; i++) {
      items[i] = new Object();
      items[i].key = i;
   }

	// set handlers (this doesn't work because you set a reference)
   for(i=0; i<items.length; i++) {
      item = items[i];
      document.getElementById("l"+i).onclick = function() {alert(item.key); return false;};
   }

	// set handlers with function objects. works, but creates an object for every link.
   for(i=0; i<items.length; i++) {
      item = items[i];
      document.getElementById("lv"+i).onclick = Function("alert("+item.key+"); return false;");
   }

	// set handlers, and store the key in the element. this leaks memory in IE.
   for(i=0; i<items.length; i++) {
      item = items[i];
      document.getElementById("lk"+i).onclick = function() {alert(this.key); return false;};
      document.getElementById("lk"+i).key = item.key;
   }


}


init();
