$(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的结果,这就是为什么我说“可能会有性能问题”的原因。 它也可能不。
文档
-
view.$el
– http://backbonejs.org/#View-$el -
$
in backbone – http://backbonejs.org/#View-dollar - jQuery基础对象 – http://api.jquery.com/jQuery/
- Zepto基础对象 – http://zeptojs.com/#$();
这两个基本上是等价的, $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扩展附加到对象原型。 一旦完成,不需要再次完成,虽然除了多次执行之外没有其他的伤害。