Javascript 主干木偶布局视图可以'；找不到DOM元素_Javascript_Backbone.js_Marionette

Javascript 主干木偶布局视图可以'；找不到DOM元素

javascript backbone.js

Javascript 主干木偶布局视图可以'；找不到DOM元素,javascript,backbone.js,marionette,Javascript,Backbone.js,Marionette,我在渲染木偶布局视图和显示该布局内的区域时遇到问题我的布局文件： template: '#fooTemplate', regions: { barRegion: '.bar' } 我的HTML： <script id="fooTemplate" type="text/template"> <div id="fooDiv"> <div class="bar"> </div>

我在渲染木偶布局视图和显示该布局内的区域时遇到问题

我的布局文件：

template: '#fooTemplate',
    regions: {
        barRegion: '.bar'
    }

我的HTML：

<script id="fooTemplate" type="text/template">
    <div id="fooDiv">
        <div class="bar">
        </div>
    </div>          
</script>

我得到一个未捕获的错误：DOM中必须存在一个“el”#foo.bar

我在LayoutView的功能中缺少什么？我有一个类似的示例运行得很好，但由于某些原因，我无法复制它。

发生这种情况是因为视图与DOM分离。如果指定

{el:#fooDiv“}

，则#fooDiv元素必须在DOM中。我认为应该有这样的东西：

<script id="fooTemplate" type="text/template">
    <div class="bar"></div>      
</script>

或

<script id="fooTemplate" type="text/template">
    <div class="bar"></div>      
</script>

<body>
    ...
    <div id="fooDiv"></div>
    ...
</body>

// "wrap" new Layout around existing div
new FooLayout({ el: '#fooDiv' });
// etc.

// create a new DOM element with the id 'fooDiv':
var fooLayout = new FooLayout({ id: 'fooDiv' });
fooLayout.render();
document.body.appendChild(fooLayout.el); // or $('body').append(fooLayout.el);