Ember.js 和 DOM 操作答案

【问题标题】：Ember.js and DOM ManipulationEmber.js 和 DOM 操作
【发布时间】：2015-10-09 22:29:35
【问题描述】：

我已经使用 Ember 一周左右，并且对有关 jQuery DOM 操作的约定有些困惑。所以我已经足够了解 Ember 是关于维护状态的，因此据我所知，使用 jQuery 直接操作 DOM 是一种不好的做法。

话虽如此，我已经遇到过一些情况，我可以看到它可能有用的地方，但并没有真正理解它的缺点。

举个例子，我目前正在构建一个引导式“导游”系统，它将引导用户浏览 UI。这涉及切换选项卡、在页面周围移动指南窗口（放置在其他 UI 元素旁边）等等。在一个部分中有一个目的地列表，我需要从列表中获取第一个元素以定位它，然后将导游窗口放在它旁边。如果我只是使用 jQuery，我可以轻松地定位列表元素，然后获取第一个元素的 ID。使用 Ember，我需要在列表中创建一个动作，该动作的气泡（似乎很费力）。

同样，我可以轻松地使用 jQuery click 事件来模拟点击/切换选项卡，可能只需要一行代码。使用 Ember，该过程涉及在该元素上创建切换操作并冒泡。

如果有人能解释为什么或为什么不这是一个不好的做法，那就太好了！

【问题讨论】：

这个addon 有可定位的模态对话框。也许它可以为您节省很多时间。

标签： jquery dom ember.js

【解决方案1】：

可能我不太了解您的目标，但我想说的是，在 Ember 中不使用 jQuery 进行 DOM 操作并没有那么痛苦。您可以将动态类名设置为要设置样式的元素（请参阅'Binding Element Attributes' section in Ember guide，请注意，对于 1.11.0+ 和更早的版本，它是不同的）。并且操作只会更改您用于绑定的属性。

关于使用 jQuery 的好坏习惯：我还没有测试过 jQuery 如何影响 Ember 应用程序性能等，但有一件显而易见的事情。使用 jQuery 进行 DOM 操作会使您的应用程序对 HTML 模板更改过于敏感。

【讨论】：