Question

这是一个挑剔的问题，但我很好奇这将是一个更有效的实施。

我在元素上添加叠加层和微调器，然后我将其删除。

我可以定义两种方法：

    addSpinner: function() {
        $('<div></div>').addClass('overlay').appendTo('#myDiv');
        $('<img>').attr('src', 'images/spinner.gif').addClass('spinner').appendTo('#myDiv');
    },

    removeSpinner: function() {
        $('.overlay, .spinner', this.el).remove();
    },

每次调用时，remove微调器都必须查找这些元素。所以我的另一个选择是让addSpinner重新定义removeSpinner，并更直接地引用元素。

addSpinner: function() {
    var overlay = $('<div></div>').addClass('overlay').appendTo('#myDiv');
    var spinner = $('<img>').attr('src', 'images/spinner.gif').addClass('spinner').appendTo('#myDiv');
    this.removeSpinner = function() {
        overlay.remove();
        spinner.remove();
    };
},

这意味着不会在DOM中搜索这两个元素，但每次都会重新定义该函数。优点和缺点？

我认为它不相关，但这些是Backbone / Marionette的观点。

Answer 1

效率最高的可能是保留对删除它们时可以使用的元素的引用，例如

var obj = {
    addSpinner: function() {
        this.overlay = $('<div />', {'class' : 'overlay'});
        this.spinner = $('<img />', {'class' : 'spinner', src : 'images/spinner.gif'});

        $('#myDiv').append(this.overlay, this.spinner);

    },
    removeSpinner: function() {
        this.overlay.add(this.spinner).remove();
    }
}

这样你就不必调用jQuery或查询DOM不成功

有效地从DOM中删除项目

1 个答案: