js注册事件作用域问题

Question

<div id="ddd" style="width:400px;height:400px;background-color:#99FF66;"></div>
function doit(){
var dom = document.getElementById('ddd');
var content = 'x';
dom.onclick = function(){
alert('提示:'+content);
}
} 
doit();我的理解是，注册点击事件后，以后触发的时候content应该已经出了doit函数的作用域，为什么还能获取到呢？

Answer 1

我认为，事件你可以看成是绑定的，比如你上面的事件绑定，在执行了这段代码之后，可以认为成，是在HTML代码中加入了onclick的属性。
之所以这么写，是为了更有效结构和行为的分离。

Answer 2

function doit(){
        var dom = document.getElementById('ddd');
        var content = 'x';
        dom.onclick = function(){
            alert(' '+content);
        }
        return 2;
    } 
    alert(doit());
实际上已经doit已经执行完毕了。但是content已经传值到了onclick里面

Answer 3

这个不要去深究，简单地可以理解为闭包为函数提供一个私有的执行环境，如果要弄清为什么，需要深入了解w3c标准，建议不去浪费这个时间。类似的还有：var getNewId=function(){
    var start=0;
    return function(){return 'id'+start++}
}();执行完毕后getNewId=function(){return 'id'+start++}而start并不在函数体内，简单看就是外层匿名函数
function(){
    var start=0;
    return function(){return 'id'+start++}
}
为函数getNewId提供了一个私有的执行环境（外界是无法访问该匿名函数中的start的）。

Answer 4

     function doit() {
            var content = 1;
            alert(content + "之前");
            $("#ddd").live("click", function () {
                content += 1;
                
                alert(content+"之后");
            }); 
        
        }
        doit();
经过测试可以得出一个结论，我是这样理解的 当初始化时候 在doic里面绑定了id ="ddd" 的click事件  ，其次再单点周div 的时候会触发  $("#ddd").live("click", function () {
                content += 1;
                alert(content+"之后");
            }); 
这段代码，而不会执行   
var content = 1;
alert(content + "之前");
也是一个作用域的问题， 但是   alert(content+"之后"); 里面的content  在外面是有声明的所以不存在 找不到定义的概念就可以成功获取到修改过后的值， 可以得出的就是 点击div 触发click的时候  执行里面的代码 不会包含外面 的一些相关操作， 当前这里的 content += 1;
                     alert(content+"之后"); 为什么没有报错，我想应该是跟初始化时候这个变量已经定义过了，而他的作用域在 click涵数之外，所有不会报错，可以正常访问。

Answer 5

这个问题需要深究的话就有一大篇文章了，有四个概念LZ可以去百度一下，都有很详细的介绍，作用域，作用域链，call object，上下文对象，一个函数从创建到执行包含的四个概念。

Answer 6

- -不懂 我一开始也和2L一样的想法  不过window.onload = function () {
function doit(){
        var dom = document.getElementById('ddd');
        var content = 'x';
        dom.onclick = function(){
            alert('提示:'+content);
        }
        content = "y"
    } 
    doit();}试了一下发现输出的是y 看样子并不是赋值进去的