Question

我希望页脚位于窗口下方的初始位置，当我调整窗口大小时。我需要在函数内部和外部声明var以使其工作。它没问题还是有更好的方法呢？

$(function(){

    // initial position:    
    var docHeight = $(window).height();
    $('#footer').css('margin-top', docHeight + 'px');

    // position when I resize the window:
    $(window).resize(function() { 
    var docHeight = $(window).height();
        $('#footer').css('margin-top', docHeight + 'px');
    });

})

我这里有代码：http://jsfiddle.net/dWpp5/

Answer 1

JavaScript具有“功能范围”。就像你说的那样，如果用“var”关键字定义一个变量，它就会成为它所在的任何功能块的本地变量。除了该功能之外的任何东西都看不到它。

但是，如果不使用“var”来定义变量或使用“var”但在函数之外 - 它是任何函数或表达式都可以访问的全局变量。

关于函数作用域的一个很酷的事情是，虽然注意到该函数之外可以看到变量 - 在父函数内执行或定义的任何函数都可以。

洞深入 - 如果你在一个函数中使用一个变量，并且该函数没有在它自身内部看到它定义，那么它将转到它的父元素以查看它是否在那里定义。如果没有找到定义 - 它会转到其父级的父级 - 依此类推，直到它到达全局范围 - 如果它没有找到全局范围的定义，则变量在全局范围内声明

Here's a Smashing Magazine article on scoping.

Answer 2

这同样有效：

$(function(){

    // initial position:    
    // this is a variable local to the doc ready function
    var docHeight = $(window).height();
    $('#footer').css('margin-top', docHeight + 'px');

    // position when I resize the window:
    $(window).resize(function() { 
        // since this function is contained within the outer function, 
        // the docHeight local from the outer scope is accessible here.
        $('#footer').css('margin-top', docHeight + 'px');
    });
})

// Here, however, docHeight is NOT accessible.

jQuery全局变种

2 个答案: