in d3：Can選擇「body」，但不能選擇「div」或「#id」或「.class」

Question

使用d3。不能做d3.select（「」）

我對d3非常新穎 - 剛開始Scott的書，並試圖在綁定數據的第一個鏡頭中的簡單示例。

我的頁面的body元素只有一個元素 - 一個div，id =「abc」和class =「abc」。

下面的示例在d3.select爲（「body」）時起作用。我得到了預期的結果附加到正文的結尾。

但是，當我將d3.select更改爲（「div」）或更改爲（「#abc」）或更改爲（「.abc」）時，我沒有將預期的5段添加到div;就好像腳本從來沒有。我看到的只有兩個標題（h1和h2）。

我相信問題和解決方案對於有經驗的人來說相當簡單。但是，對於這個新事物，他們感到莫名其妙。具體而言，爲什麼d3.select只能用於「body」選擇器，而不能與其他任何合法選擇器一起工作？

下面是相關代碼：

<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

我相信我偶然發現了這個解決方案。

我放置腳本之前立即和所有的選擇，我無法使工作現在工作