$(this.el).html和这个$ el.html有什么区别?

有什么区别:

$(this.el).html 

 this.$el.html 

阅读一些骨干的例子,有些是以另一种方式做的。

$(this.el)用jQuery(或Zepto)包装一个元素。 所以,如果你的视图HTML是这样的:

<div id="myViewElement"></div>

…和this.el引用该div,那么$(this.el)将等同于直接通过jQuery获取它: $('#myViewElement')

this.$el是对jQuery(或者Zepto)对象的caching引用,所以你可以调用$(this.el)得到一个副本。 目的是为了节省您需要调用$(this.el) ,这可能会有一些开销,因此性能问题。

请注意:这两个不相等。 this.el本身是一个宿主对象的引用HTMLElement – 没有涉及的库。 这是document.getElementById的返回值。 $(this.el)创build一个jQuery / Zepto对象的新实例。 this.$el引用前一个对象的单个实例。 只要您了解多次调用$(this.el)的成本,使用它们中的任何一个都不是“错误的”。

在代码中:

 this.ele = document.getElementById('myViewElement'); this.$ele = $('#myViewElement'); $('#myViewElement') == $(this.ele); 

此外,值得一提的是,jQuery和Zepto具有部分内部caching,所以对$(this.el)额外调用最终可能会返回caching的结果,这就是为什么我说“可能会有性能问题”的原因。 它也可能不。

文档

这两个基本上是等价的, $el是jQuery或Zepto对象el的caching版本 ,你看到使用$(this.el)例子的原因是因为它只是在backbone.js 0.9.0)。

* 从技术上讲, Chris Baker指出$(this.el)会在每次调用时创build一个新的jQuery / Zepto对象,而this.$el会每次都引用同一个对象。

如果$el存在,并且是一个jQuery对象,则不应该使用$(this.el)因为它将在已经存在的情况下初始化一个新的jQuery对象。

他们产生完全一样的东西; 也就是对视图元素的引用。 $ el只是$(this.el)的一个jquery包装器。 看看这个参考: http : //documentcloud.github.com/backbone/#View- $ el

我通常看到这个:

 var markup = $(this).html(); $(this).html('<strong>whoo hoo</strong>'); 

我同意Raminon。 你看过的例子看起来不对。

这段代码通常在jquery循环中看到,比如each()或事件处理程序。 在循环内部,'el'variables将指向纯元素,而不是一个jQuery对象。 事件处理程序中的“this”也是如此。

当你看到以下内容:$(el)或者$(this)时,作者得到了一个对dom对象的jQuery引用。

这里有一个例子,我只是用来将数字转换为罗马numerials:(注意,我总是使用jQuery而不是$ – 太多与mootools碰撞…)

 jQuery(document).ready(function(){ jQuery('.rom_num').each(function(idx,el){ var span = jQuery(el); span.html(toRoman(span.text())); }); }); 

包装$()中的元素将jQuery扩展附加到对象原型。 一旦完成,不需要再次完成,虽然除了多次执行之外没有其他的伤害。