Question

我目前正在构建一个大型骨干应用程序，这是我的问题。如何应对DOM元素是最好的方式？现在，我只是在视图的初始化函数中找到将来访问的所有元素（表单和类似的东西），并将它们绑定到视图本身。这样我每次需要与它们交互时都不必搜索这些元素。但实际上，这些参考文献的数量正在快速增长。这是好方法还是我可以做得更好？在此先感谢：）

代码示例：

initialize: function () {
    this.form1 = this.$el.find('.whatever');
    ...
    ...
}

Answer 1

应用$use方法.selector后，将会缓存。

HTML：

<div data-container>
    <div data-something>smthng</div>
</div>

JS：

var View = Backbone.View.extend({
    el : '[data-container]',
    ui : {
        something : '[data-something]'
    },
    someFn : function () {
        this.$use(this.ui.something).css('background', '#999');
        return this;
    },
    $use : function (selector) {
        console.log(typeof this.ui[selector] === 'undefined' ? 'dom query' : 'already cached');
        var $selector = this.ui[selector] === selector ?
            this.ui[selector] :
            this.$(selector);

        return this.ui[selector] = $selector;
    }
});

new View().someFn().someFn().someFn();

演示：http://jsfiddle.net/vpetrychuk/K7nmr/

Backbone.js DOM元素引用方法

1 个答案: