在Ember中按ID获取元素

问题描述：

我正在运行两个余烬应用程序。一个包含以下内容：

I am running two ember applications. One has the following component:

import Ember from 'ember';

export default Ember.Component.extend({
 tagName: 'a',

 click: function() {
  Ember.$('#wrapper').toggleClass('toggled');
 }
});

另一个，有一个：

import Ember from 'ember';

export default Ember.Component.extend({
 tagName: 'a',

 click: function() {
  this.$('#wrapper').toggleClass('toggled');
 }
});

在这里我不明白的是为什么在一个应用程序中我使用 Ember。$（'＃wrapper'），另一个使用 this。$（'＃wrapper'）。

What I can't understand here is why in one application I select an element by ID using Ember.$('#wrapper') and in the other using this.$('#wrapper').

这是什么意思？灰烬版本？

What is this about? Ember version?

更新

我很困惑，因为这两个部分相同：

I'm very puzzled, since both components are the same:

{{#show-menu}}
    <i class="fa fa-bars"></i>`
{{/show-menu}}`

它们都是用于隐藏侧边栏div的汉堡菜单，而 #wrapper 是外部元素。

They are both hamburger menus used to hide a sidebar div, and the #wrapper is an external element.

由于在这两种情况下， #wrapper 都是外部元素，所以不仅仅第一种情况下的@Gaurav和@Kevin Jhangiani有用吗？

Since in both cases the #wrapper are external elements, shouldn't just the first case work @Gaurav and @Kevin Jhangiani?

答

区别在于jquery选择器的上下文。

The difference is in the context of the jquery selector.

Ember.$()

的作用域是整个文档，即，您可以访问页面上的任何元素。

is scoped to the entire document, ie, you can access any element on the page.

相反，

this.$()

的作用域是当前组件或视图，因此您只能访问属于子元素的dom元素。

is scoped to the current component or view, and thus you can only access dom elements that are children.

通常，您应该使用 this。$ ，因为它的性能更高（因为搜索空间仅子元素）。 Ember。$ 应该保留，当您绝对需要访问当前上下文之外的元素时。

Generally, you should be using this.$ as it will be more performant (since the search space is only child elements). Ember.$ should be reserved for times when you absolutely need to access an element outside of the current context.

相关推荐