Question

我只是从d3而不是通常的jquery开始，但即使他们的基本示例似乎也没有实际附加任何内容。我的任何部分标签都没有添加任何内容：

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">

  <title>Test</title>
  <meta name="description" content="stats">
</head>

<body>
    <script type="text/javascript"src="js/d3.min.js"></script>
  <script type='text/javascript'>
var section = d3.selectAll("section");

section.append("div")
    .html("First!");

section.append("div")
    .html("Second.");
  </script>
<section>asfd</section>
<section>erasdf</section>
<section>asdfq</section>
<section>asdfasdfas</section>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
</body>
</html>

Answer 1

你的附加功能不起作用的原因是你先添加了脚本，后来添加了<section> 。由于脚本标记是第一个，脚本将首先被执行，执行selectAll("section")它会搜索要追加的section标记，但它不存在，因为section标记位于脚本之后。为了使其正常工作，将您的脚本移至底部。

<强> HTML：

<!doctype html>    
<html lang="en">
<head>
  <meta charset="utf-8">    
  <title>Test</title>
  <meta name="description" content="stats">
</head>

<body>

<section>asfd</section>
<section>erasdf</section>
<section>asdfq</section>
<section>asdfasdfas</section>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>

 <script type="text/javascript"src="js/d3.min.js"></script>
 <script type='text/javascript'>
var section = d3.selectAll("section");

section.append("div")
    .html("First!");

section.append("div")
    .html("Second.");
  </script>
</body>
</html>

d3基本附加示例不起作用

1 个答案: