Javascript 有什么区别：$(this.el).html 和 this.$el.html
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11512090/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What's the difference between: $(this.el).html and this.$el.html
提问by CLiown
What's the difference between:
有什么区别：
$(this.el).html
and
和
this.$el.html
Reading a few backbone examples and some do it one way and other another way.
阅读一些骨干例子，有些是用一种方式来做的，另一些则是另一种方式。
回答by Chris Baker
$(this.el)wraps an element with jQuery (or Zepto). So, if your view HTML was this:
$(this.el)用 jQuery（或 Zepto）包装一个元素。因此，如果您的视图 HTML 是这样的：
<div id="myViewElement"></div>
<div id="myViewElement"></div>
...and this.elreferenced that div, then $(this.el)would be the equivalent of retrieving it directly via jQuery: $('#myViewElement').
...并this.el引用该 div，则$(this.el)相当于直接通过 jQuery: 检索它$('#myViewElement')。
this.$elis a cached reference to the jQuery (or Zepto) object, so a copy of what you would get from calling $(this.el). The intent is to save you the need to call $(this.el), which may have some overhead and therefor performance concerns.
this.$el是对 jQuery（或 Zepto）对象的缓存引用，因此是调用$(this.el). 目的是让您无需调用$(this.el)，这可能会产生一些开销并因此而担心性能问题。
Please note:the two are NOT equivalent. this.elalone is a reference to a host object HTMLElement -- no libraries involved. This is the return of document.getElementById. $(this.el)creates a new instance of the jQuery/Zepto object. this.$elreferences a single instance of the former object. It is not "wrong" to use any of them, as long as you understand the costs of multiple calls to $(this.el).
请注意：两者不等价。this.el单独是对宿主对象 HTMLElement 的引用——不涉及库。这是 的回归document.getElementById。$(this.el)创建 jQuery/Zepto 对象的新实例。this.$el引用前一个对象的单个实例。只要您了解多次调用$(this.el).
In code:
在代码中：
this.ele = document.getElementById('myViewElement');
this.$ele = $('#myViewElement');
$('#myViewElement') == $(this.ele);
Also, it is worth mentioning that jQuery and Zepto have partial internal caches, so extra calls to $(this.el)mightend up returning a cached result anyway, and that's why I say "may have performance concerns". It also may not.
此外，值得一提的是 jQuery 和 Zepto 具有部分内部缓存，因此无论如何额外调用$(this.el)可能最终会返回缓存的结果，这就是我说“可能存在性能问题”的原因。它也可能没有。
Documentation
文档
view.$el- http://backbonejs.org/#View-$el$in backbone - http://backbonejs.org/#View-dollar- jQuery base object - http://api.jquery.com/jQuery/
- Zepto base object - http://zeptojs.com/#$()
view.$el- http://backbonejs.org/#View-$el$在主干中 - http://backbonejs.org/#View-dollar- jQuery 基础对象 - http://api.jquery.com/jQuery/
- Zepto 基础对象 - http://zeptojs.com/#$()
回答by Hyman
The two are essentially* equivalent, with $elbeing a cached versionof the jQuery or Zepto objects el, the reason why you see examples using $(this.el)is because it was only added in a later releaseof backbone.js (0.9.0).
两者本质上是* 等价的，$el作为jQuery 或 Zepto 对象的缓存版本，el您看到使用示例的原因$(this.el)是因为它只是在以后的backbone.js (0.9.0)版本中添加的。
*Technically as Chris Bakerpoints out $(this.el)will (probably) create a new jQuery/Zepto object each time you call it while this.$elwill reference the same one each time.
*从技术上讲，正如Chris Baker指出的那样，$(this.el)每次调用它时（可能）都会创建一个新的 jQuery/Zepto 对象，而this.$el每次都会引用相同的对象。
回答by Brendan Delumpa
They yield exactly the same thing; that is, a reference to a view's element. $el is simply a jquery wrapper for $(this.el). Look at this reference: http://documentcloud.github.com/backbone/#View-$el
它们产生完全相同的东西；也就是说，对视图元素的引用。$el 只是 $(this.el) 的一个 jquery 包装器。看看这个参考：http: //documentcloud.github.com/backbone/#View-$el
回答by Kevin B
If $elexists on thisand is a jQuery object, you shouldn't use $(this.el)because it would be initializing a new jQuery object when one already exists.
如果$el存在this并且是一个 jQuery 对象，则不应使用，$(this.el)因为当一个新的 jQuery 对象已经存在时，它会初始化一个新的 jQuery 对象。
回答by Perry Tew
I usually see this:
我经常看到这个：
var markup = $(this).html();
$(this).html('<strong>whoo hoo</strong>');
I agree with Raminon. Your examples you've seen look wrong.
我同意拉米农的观点。你看到的例子看起来是错误的。
This code is typically seen within a jquery loop, such as each(), or an event handler. Inside the loop, the 'el' variable will point to the pure element, not a jQuery object. The same holds true for 'this' inside an event handler.
此代码通常出现在 jquery 循环中，例如 each() 或事件处理程序。在循环内部，'el' 变量将指向纯元素，而不是 jQuery 对象。这同样适用于事件处理程序中的“this”。
When you see the following: $(el) or $(this), the author is getting a jQuery reference to the dom object.
当您看到以下内容：$(el) 或 $(this) 时，作者正在获取对 dom 对象的 jQuery 引用。
Here's an example I just used to convert numbers to roman numerials: (Note, I always use jQuery instead of $ -- too many collisions with mootools...)
这是我刚刚用来将数字转换为罗马数字的示例：（注意，我总是使用 jQuery 而不是 $——与 mootools 的冲突太多......）
jQuery(document).ready(function(){
jQuery('.rom_num').each(function(idx,el){
var span = jQuery(el);
span.html(toRoman(span.text()));
});
});
回答by Matt S
Wrapping an element in $() appends the jQuery extensions to the object prototype. Once that's done it doesn't need to be done again, although there's no harm other than performance in doing it multiple times.
在 $() 中包装元素会将 jQuery 扩展附加到对象原型。一旦完成，就不需要再次完成，尽管多次执行除了性能之外没有任何害处。
