D3.js 插入元素,删除元素

插入元素涉及的函数有两个：

一、append()：在选择集末尾插入元素

　　假设有三个段落元素

<p>Apple</p>
<p>Pear</p>
<p>Banana</p>

body.append("p")
    .text("append p element");

　　在 body 的末尾添加一个 p 元素，结果为：

Apple
Pear
Banana
append p element

 

 

 

 

 

二、insert()：在选择集前面插入元素

　　　在 body 中 id 为 myid 的元素前添加一个段落元素。

<p>Apple</p>
<p id="myid">Pear</p>
<p>Banana</p>

body.insert("p","#myid")
  .text("insert p element");

　　已经指定了 Pear 段落的 id 为 myid，因此结果如下。

Apple
insert p element
Pear
Banana

 

 

 

 

 三、删除元素

　　删除一个元素时，对于选择的元素，使用 remove 即可，例如：

var p = body.select("#myid");
p.remove();