Question

有什么区别：

$(this.el).html

和

this.$el.html

阅读一些主干示例，其中一些以单向和另一种方式进行。

Answer 1

$(this.el)用jQuery（或Zepto）包装元素。所以，如果您的视图HTML是这样的：

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

...而this.el引用了div，然后$(this.el)相当于直接通过jQuery检索它：$('#myViewElement')。

this.$el是对jQuery（或Zepto）对象的缓存引用，因此可以通过调用$(this.el)获得一个副本。目的是为您节省调用$(this.el)的需要，这可能会产生一些开销，从而导致性能问题。

请注意：两者不相同。仅this.el是对宿主对象HTMLElement的引用 - 不涉及任何库。这是document.getElementById的回归。 $(this.el)创建jQuery / Zepto对象的新实例。 this.$el引用前一个对象的单个实例。只要您了解多次拨打$(this.el)的费用，使用其中任何一项都不是“错误”。

在代码中：

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

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

另外，值得一提的是jQuery和Zepto有部分内部缓存，因此对$(this.el) 的额外调用可能会最终返回缓存结果，这就是为什么我说“may有性能问题“。它也可能没有。

<强>文档

view.$el - http://backbonejs.org/#View-$el
$ - http://backbonejs.org/#View-dollar
jQuery基础对象 - http://api.jquery.com/jQuery/
Zepto基础对象 - http://zeptojs.com/#$()

Answer 2

这两个基本上是 *等价，$el是jQuery或Zepto对象el的{{3}}，这就是为什么你看到使用{的例子的原因{1}}是因为它仅在后来cached version的backbone.js（0.9.0）中添加。

* _{从技术上讲，release指出$(this.el)每次调用它时（可能）会创建一个新的jQuery / Zepto对象，而$(this.el)每次都会引用相同的对象}

Answer 3

如果$el上存在this并且是jQuery对象，则不应使用$(this.el)，因为它会在已存在的新jQuery对象时初始化它。

Answer 4

他们产生完全相同的东西;也就是说，对视图元素的引用。 $ el只是$（this.el）的jquery包装器。请看这个参考：http://documentcloud.github.com/backbone/#View- $ el

Answer 5

我经常看到这个：

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

我同意Raminon。您看到的示例看起来不对。

此代码通常在jquery循环中看到，例如each（）或事件处理程序。在循环内部，'el'变量将指向纯元素，而不是jQuery对象。对于事件处理程序中的“this”也是如此。

当您看到以下内容：$（el）或$（this）时，作者将获得对dom对象的jQuery引用。

以下是我刚才用于将数字转换为罗马数字的示例：（注意，我总是使用jQuery而不是$ - 与mootools发生太多冲突......）

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

Answer 6

在$（）中包装元素会将jQuery扩展追加到对象原型中。一旦完成它就不需要再次完成，尽管除了多次执行之外没有任何伤害。

有什么区别：$（this.el）.html和这个。$ el.html

6 个答案: