引子
继 Learn D3: Animation 第七篇，只是英文翻译，可修改代码的部分用静态图片替代了，想要实时交互请阅读原文。
-
版本：Published Mar 24, 2020
正文
如果你熟悉此教程中的 D3 ，你可能会惊讶于 D3 选择器被提及的如此之少。
那是因为你可能不需要它们！
D3 选择器适用一个特殊的定位：快速，动态图表的增量更新。如果你关注的是静态图表，或者每帧都可以从头开始重新绘制的图表，那么你可能更喜欢不同的抽象。另一方面，如果你想要动画过渡或从现代浏览器中榨取最佳性能，选择器适合你。
（即使你决定不使用选择器，请记住 D3 还有大量其它有用的可视化工具。比例尺、形状、插值器、颜色、地图投影和许多其它功能可用于 Canvas、WebGL 或其它 DOM 抽象，如 Observable 的 HTML 标记模板文字、React 或 Svelte 。D3 还可以使用统计、分组和聚合、时间序列和解析的方法，协助数据清理和分析。）
本质上，D3 选择器指定的是转换而不是表示。你可以指定将当前状态转换为所需状态所做的更改（插入、更新和删除），而不是表示图表（DOM）的所需状态。这有时很乏味，但允许你设置过渡动画，并最小化对 DOM 的更改，从而提高性能。
让我们看看如何做。
假设我们想显示字母表中的字母。虽然不是很直观，但我们将保持简单，以专注于技术(有关实际的示例，请参见 D3 图库 的动画和交互部分。）
这个图表是静态的，因为它是在每次单元运行时从头开始创建的，这使得 D3 代码在本质上等同于 HTML 文本。
那么，何必要用选择器呢？对，对于静态图表，没有什么理由这样做。
但假设你想更新此图表以响应不断变化的数据。并且你不想从头开始重新绘制，希望应用最小的更新集来反映新数据。你希望重用现有元素，添加需要的元素，删除不需要的元素。只需将上述代码移动到一个在数据更改时调用的方法中，你就可以获得高性能的增量更新！