D3 选择
学习 D3 的 select() 和 selectAll() 方法如何作用于 DOM 元素。
选择是 D3.js 中一个基本的概念，用于选取 DOM 元素并对其进行操作。在 D3.js 中，我们有以下两种选择方法：
select()方法selectAll()方法
select() 方法
让我们来学习 select() 方法，这是用于选择的一种重要方式。它非常强大，我们在后续课程中会进一步体会。该方法可用于选择不同的 HTML 标签并进行操作。如果指定的标签不存在，则返回一个空的选择结果；如果有多个相同标签，它只会选择第一个元素。
下面我们使用 select() 方法运行经典的“hello world”程序。
No configuration found for ID: c2d649fa956ded643e5a85af3b105a478b95981bf9f47e754a507baeda858414
在上面的例子中，从第 1 行到第 2 行，我们通过调用 select() 方法选取了 div 的内容，并将其存储在变量 s 中。点击 RUN 后，控制台将显示 hello world。
selectAll() 方法
接下来我们来看另一种方法 —— selectAll()，它也是 D3.js 中用于选择的方法。该方法用于选择多个相同类型的 HTML 标签并进行统一操作。如果目标标签不存在，则返回一个空的选择结果；如果存在多个相同标签，它会全部选中。
下面通过一个例子来演示 selectAll() 方法的实际应用。
No configuration found for ID: 3123508511b6b4afc2655c9d3b763f484dfb0acaa0709eb66f4debbb3b8cc29a
在上面例子的第 1 行中，我们使用 selectAll() 方法选中了所有的 HTML div 标签，并将它们的颜色设置为绿色。
我们使用了 style() 方法，通过 selectAll() 方法为文本添加样式。不用担心，我们将在后续课程中详细讲解 style() 方法。