javascript - Backbone.js 为什么渲染函数中没有 DOM？

Question

在主干的渲染函数中，

render: function() {
    this.$el.html('<div id="customID"></div>

    console.log($('#customID')[0]);
    setTimeout(function(){
        console.log($('#customID')[0]);
    }, 1);
}

第一个 console.log 返回“未定义”...

第二个返回一个 DOM 节点。

为什么在没有超时的情况下渲染函数中的 DOM 不可用？

Answer 1

那是因为该元素尚未添加到文档中。DOM 可用，但元素不在其中。

该setTimeout调用使浏览器在不再忙于运行代码时调用代码，并且在呈现完成并且元素已添加到文档时发生。

如果你在 jQuery 调用中使用元素作为范围，即使它不在文档中，它也会找到 div：

console.log($('#customID', this.$el)[0]);

或者：

console.log(this.$el.find('#customID')[0]);