Backbone.js 视图中的 this.el 到底是什么？答案

【问题标题】：What exactly is this.el in Backbone.js views?Backbone.js 视图中的 this.el 到底是什么？
【发布时间】：2014-06-18 23:53:26
【问题描述】：

我对主干视图中el 的含义感到困惑。一些教程（例如this one）使el 看起来像是正在创建的视图的父，其中render 方法应该将视图附加到它的el。其他人（如this）将其视为视图本身的元素。有没有这方面的最佳实践？

【问题讨论】：

第二个是正确的

标签： javascript backbone.js

【解决方案1】：

el 绝对是视图对应的元素，而不是它的父元素。在您的第一个示例中，他们将整个页面 body 视为视图，然后在渲染时插入组成它的组件。我想这可能适用于代表整个页面的顶级视图。 Backbone 为您提供了很大的灵活性（即用来吊死自己的绳索），因此您可以通过多种方式做事。一般来说，无论你怎么做，如果你在将视图附加到 DOM 之前尽可能地实际构建并附加视图的组件，效果最好。这在您的第二个示例以及Backbone docs 本身中提到：

所有视图始终都有一个 DOM 元素（el 属性），无论是它们是否已经插入到页面中。以这种方式，视图可以随时渲染，并随时插入到 DOM 中一次，为了用最少的资源获得高性能的 UI 渲染尽可能回流和重绘。

像Marionette 这样的项目实现了许多 Backbone 最佳实践，并让您在更高的抽象级别上进行操作。我强烈建议您检查一下，而不是自己尝试找出所有最佳实践模式。

【讨论】：

【解决方案2】：

两者都有点... el 代表您的视图将被渲染到的 dom 元素。您的视图模板可能有多个顶级元素。为简化起见，当主干呈现视图时，它使用“父”元素来包装模板的内容。默认情况下，此元素是一个 div（设置 tagName 以覆盖它和/或设置 className 以在其上设置 css 类）并且是 el 所指的。

【讨论】：