Question

输入（）选择中的额外select（）究竟做了什么，为什么没有selectAll（）？

现在我可能会发布更多文字以“达到你的质量标准”，但我确信这个问题足够精确，希望不要太愚蠢。我花了几天时间阅读各种d3教程和文档，这一部分仍然从我这里逃脱。

Answer 1

在select上拨打enter selection的情况很少见;更常见的是使用append或insert代替。然而，所有这三种方法的最终结果是相同的：它指定了如何在输入选择中实例化元素。

当您执行data-join时，会返回三个新选择：

更新选择：与数据对应的所选元素
退出选择：任何剩余元素（无相应数据）
输入选择：任何剩余数据（无相应元素）

由于输入选择是剩余数据，因此根据定义没有相应的元素。因此，输入选择最初包含占位符节点，您必须将其实例化为适当的元素。您几乎从不会看到这些节点，因为您通常会通过调用append或insert来告诉D3如何创建缺少的元素。这些方法创建新元素并将它们插入DOM。（父节点由先前的select确定，如nested selections教程中所述。）

在极少数情况下，您可能希望执行标准附加或插入以外的操作以实例化输入节点。例如，标准append方法总是创建相同名称的元素（例如“div”或“rect”）。如果要动态指定名称，可以使用select而传入函数来创建新元素（如this thread in the d3-js mailing list中所述）：

enterSelection.select(function(d) {
  return this.appendChild(document.createElement(d.name));
});

事实上，如果你看一下how append is implemented，你会发现它只是选择之上的一个包装器。稍微简化的实现是：

d3.selection.prototype.append = function(name) {
  return this.select(function() {
    return this.appendChild(document.createElement(name));
  });
};

这些示例实现被简化，因为它们不处理命名空间的SVG元素。因此，使用内置方法更容易，这些示例仅用于解释D3如何在内部工作。

Answer 2

在.select()选项上调用.enter()会对其他选择做同样的事情 - 您可以使用它来缩小您选择的范围。由于.selectAll()选择指的是实际上尚未存在的事物，因此.enter()不会有意义。因此，您只能再次选择整个选择（因为没有区别特征）。

enter（）选择中的额外select（）究竟是做什么的？

2 个答案: