jquery - jQuery 将 DOM 元素分配给对象

Question

在给定的场景中，我如何将 DOM 对象分配给变量并调用它？在这个例子中，我试图获得“导航”元素的高度。现在它没有返回任何值，我认为这是因为在文档准备好之前调用了元素。

$(document).ready( function(){ 
    gbe.init();
});


var gbe = {

    navigation  : $("nav"),

    init    :   function() {
        gbe.nav.init();
    },

    nav     :   {

        init : function() {
            navHeight : gbe.navigation.height(); 
            console.log(gbe.nav.init.navHeight, gbe.navigation.height());
        }
    }

};

Answer 1

如果你这样做了怎么办：

$(document).ready( function(){ 
  gbe.navigation = $("nav");
  gbe.init();
});

Answer 2

恕我直言，您应该通过 jQuery 将元素传递给 init 函数，并将其传递给 .ready() ，如下所示：

$(document).ready( function(){ 
    gbe.init($("nav"));
});

var gbe = {    

    init    :   function(el) {
        gbe.navigation : el,
        gbe.nav.init();
    },

    nav     :   {

        init : function() {
            navHeight : gbe.navigation.height(); 
            console.log(gbe.nav.init.navHeight, gbe.navigation.height());
        }
    }

};

Answer 3

尝试将您的 $(document).ready 放在 gbe 的定义之下。只有你的 console.log 语句中的第二个条目会起作用。

Answer 4

​$(document).ready(function() {
    var $nav = $("nav");
    var height = $nav.height();
    console.log(height);
});​

您是否正在尝试揭示模块模式？上面的代码是快速而肮脏的方式。

小提琴：http : //jsfiddle.net/jhZSG/