Question

使用d3。不能做d3.select（＆＃34;＆＃34;）

我是d3的新手 - 刚开始撰写斯科特的书，并在第一次尝试绑定数据时尝试了这个简单的例子。

我的页面的body元素只有一个元素 - 一个id为id =＆＃34; abc＆＃34;和class =＆＃34; abc＆＃34;。

当d3.select为（＆＃34; body＆＃34;）时，以下示例有效。我将预期的结果附加到正文的末尾。

但是，当我将d3.select更改为（＆＃34; div＆＃34;）或更改为（＆＃34;＃abc＆＃34;）或更改为（＆＃34; .abc＆＃34;）时，我没有将预期的5个段落附加到div;好像剧本从未出现过。我看到的只有两个标题（h1和h2）。

我确信问题和解决方案对于有经验的人来说非常简单。然而，对于这个新人来说，他们感到莫名其妙。具体来说，为什么d3.select似乎只适用于＆＃34; body＆＃34;选择器而不是任何其他合法选择器？

以下是相关代码：

<h1>Testing</h1>
<script>
var dataset = [5, 10, 15, 20, 25];
d3.select("div") //"div" doesn't work - only "body" works
   .selectAll("p")
    .data(dataset)
    .enter()
    .append("p")
   .text(function (d) { return "NewParagraph " + d; });
</script>

<div id="abc" class="abc">
<h2>This is a Div</h2>
</div>

Answer 1

您需要在定义了使用的元素后运行脚本。您在脚本之后定义了div。如果您将div放在script之前，它应该可以正常工作。

Answer 2

我相信我偶然发现了解决方案。

我把脚本放在了之前，我现在无法正常工作的所有选择

在d3中：可以选择＆＃34; body＆＃34;但不能选择＆＃34; div＆＃34;或＆＃34;＃id＆＃34;或＆＃34; .class＆＃34;

2 个答案: