javascript - 未指定预定义el不会渲染主干 View

我想做的是创建可删除而不移除父元素的视图。我发现，当我直接在View上设置el属性时，当我.remove()设置时，父元素也会被删除。

我尝试过创建一个仅带有tagName的视图，以为它会将其弹出到body中，但是事实并非如此，它似乎根本没有将其插入页面中。

从元素中完全删除视图而不删除实际包含元素的正确方法是什么？

最佳答案

我不确定“父元素”是否为el。

var DemoView = Backbone.View.extend({
    el: "#container",
    events: {
        "click button": "removeSelf"
    },
    render: function () {
        this.$el.append("<button>remove</button>");
        return this;
    },
    removeSelf: function () {
        this.remove();
    }
});
new DemoView().render();

如果单击按钮，将删除#container；如果您不希望删除#container，只需不设置el属性，DemoView将创建一个空的div，就像这样：

var DemoView = Backbone.View.extend({
    events: {
        "click button": "removeSelf"
    },
    render: function () {
        this.$el.append("<button>remove</button>");
        return this;
    },
    removeSelf: function () {
        this.remove();
    }
});
var demoView = new DemoView();
$("#container").append(demoView.render().el);

现在，如果单击该按钮，demoView将被删除，但#container不会被删除。