关于nettuts"学习jquery 30天"的四个问题

Question

我正在做一个关于nettuts的免费jQuery课程,叫做Jeffrey Way学习jquery 30天,我有四件事我真的很难过,首先是这里的代码:

(function() {
    $('html').addClass('js');

    var contactForm = {
            container: $('#contact'),

        init: function() {
            $('<button></button>', {
                text: 'Contact Me'
            })
                .insertAfter('article:first-child   ')
                .on('click', this.show);
            },
        show: function() {
            contactForm.container.slideDown(500);
        }                       
    };

    contactForm.init(); 

})();

当您单击网站上的"与我联系"按钮时,它基本上会滑下联系表单.我的问题是:

1. 什么是"初始"的全部意义,你需要它吗？
2. 为什么整个jquery代码在变量里面？
3. 上的串码,说.on('click', this.show);你为什么需要this在this.show？
4. 最后,为什么你需要contactForm.container.slideDown(500);为什么不能只是说container.slideDown(500);或$('form.contact').slideDown(500); (顺便说一下,滑下来的形式的id是contact.

Answer 1

什么是"初始"的全部意义,你需要它吗？

这段代码创建了一个javascript对象,init调用了一个函数,然后调用该函数.您可以轻松地将此代码移动到对象之外,但之后您将无法重用它,并使用它执行其他面向对象的操作.

为什么整个jquery代码在变量里面？

在Javascript(不只是jQuery)中,一切都是对象.函数是一个对象,对象是对象等.这个代码创建一个带有3个变量的对象:container存储jquery对象; init,存储功能; 并show存储一个功能.然后将其分配给contactform变量.

在.on('click',this.show)的代码字符串上; 你为什么要在this.show中使用它？

this.show引用.show()该this对象的方法.在此上下文中this是contactForm对象,并且show是作为对象传递的show函数(但未被调用).这样做的效果是单击按钮时,会调用show函数.

最后,为什么需要contactForm.container.slideDown(500); 为什么你不能只说container.slideDown(500); 或$('form.contact').slideDown(500); (顺便说一下,向下滑动的表格的ID是联系方式.

因为container是属于contactform对象的属性(即变量).你可以做类似的事情,$('#contact').slideDown(500);但你已经有了对$('#contact')in 的引用contactform.container,而不使用它会导致不必要的开销.