Question

我正在使用Backbone构建一个网页应用，我遇到了一个问题：我的主视图依赖于将基于URL替换页面正文部分的模板，但由于我必须为该视图提供“el”，我希望它是模板本身，将插入到DOM中“渲染”或“初始化”方法。

但是当我调用新的MyMasterView时，el是未定义的，因为它在实例化时不存在于DOM中。

我该怎么办？

我找到的唯一修复是将el设置为我替换内容的现有DOM，并在渲染中调用.remove（）。append（the_template），但我不确定这是最好的方法。

感谢您的帮助。

Answer 1

我们可以考虑在DOM

中有以下div的场景

<div id="existing">

</div>

此div可以是您想要插入视图生成的html的任何其他元素。

假设您有以下模板，

<div id="inside_template">
  <!-- content of the template goes here -->
</div>

您可以为视图指定existing作为el，因为它已经存在于div中。唯一的问题是，如果它有一些像body之类的标签，那么如果你在清除视图的同时从视图中删除它（以防止内存泄漏），它将从dom删除标签不希望。

可以解决这个问题，将existing指定为el，在el之后呈现视图的html，然后在将模板html附加到之后调用setElement之后DOM喜欢，

render : function() {
  this.$el.html(this.template());
  this.setElement("#inside_template");

  // another render method content
}

这样做会将视图的el从existing（或任何其他DOM元素）更改为inside_template。因此，在删除el时，{@ 1}}元素将被删除，保留inside_template元素，因为它在DOM中。

Answer 2

您是否尝试过el null并设置tagName？如果这样做，_ensureElement将为视图元素创建一个新的分离DOM节点。您应该能够渲染与页面的DOM分离的DOM片段，然后外部代码可以使用append或者像jQuery的replaceWith之类的东西将该元素放置到位。