上一节给大家讲述额绑定数据的原理。当数组的长度与元素的数量不一致时，有enter部分和exit部分，
前者表示存在多余的数据，后者表示存在多余的元素。本节将给大家介绍如何处理这些多余的东西，最后会给大家讲解一个
处理模板，此模板包含处理enter、exit、update部分的内容。
enter的处理方法 :
如果没有足够的元素，那么处理方法就是添加元素。请看代码 :
1 render() {
2 return (
3 <div id="body" >
4 <p></p>
5 </div>
6 );
7 }
1 var dataList = [3,6,9]
2 // 选择id为body的容器内的所有的p元素，将选择集结果赋值给变量p
3 var p = d3.select("#body")
4 .selectAll("p")
5
6 //绑定数据后，分别获取update和enter部分。
7 var update = p.data(dataList);
8 var enter = update.enter();
9
10 //update部分的处理方法是直接修改内容
11 update.text(function(d){
12 return d
13 })
14
15 //enter部分的处理方法是添加元素后再修改内容
16 enter.append("p")
17 .text(function(d){
18 return d
19 })
这个例子中，id为body的div中的p元素只有一个，但是dataList中的数据有三个。因此，enter部分有多余的两个数据。
对于多余数据的处理方法就是添加元素(append),使其与多余数据对应。处理之后，d为body的div中有三个p元素。内容分别为
<p>3</p>
<p>6</p>
<p>9</p>
但是在我们开发过程中，从后端服务器读取数据后，网页中是没有与之对应的元素的。因此，有一个很常见的用法 ：
选择一个空集，然后使用enter().append()的形式来添加足够的数量的元素。例如，假设id为body的div里没有P元素，请看代码 :
1 render() {
2 return (
3 <div id="body" >
4
5 </div>
6 );
7 }
1 var dataList = [100,200,300,400,500]; //定义数组数据
2 var body = d3.select("#body") //选择id为body的容器赋值给变量body
3 body.selectAll("p") //选择body中所有的p元素，但是没有p，因此说是我们选择了一个空集
4 .data(dataList) //绑定dataList数组
5 .enter() //返回enter部分
6 .append("p") //添加p元素
7 .text(function(d){
8 return d
9 })
上述代码中，selectAll选择了一个空集，然后绑定数据。由于选择集为空，因此data()返回的update部分为空。
然后调用enter()返回的enter部分，enter部分包含多余的五个数据。接下来向enter部分添加元素(append)，使得
每一个数据都有元素p与之对应。最后，更改p元素的内容。需要的时候，可以继续更改样式等。最终，网页中的元素结构为 :
<p>100</p>
<p>200</p>
<p>300</p>
<p>400</p>
<p>500</p>
exit的处理方法 :
如果存在多余的元素，没有数据与之对应，那么就需要删除元素。使用remove()即可删除元素。请看下面示例。
假设id为body的div中的有5个p元素。
1 render() {
2 return (
3 <div id="body" >
4 <p></p>
5 <p></p>
6 <p></p>
7 <p></p>
8 <p></p>
9 </div>
10 );
11 }
1 var dataList = [100,200,300];
2 var p = d3.select("#body")
3 .selectAll("p")
4
5 //绑定数据后，分别获取update部分和exit部分
6 var update = p.data(dataList);
7 var exit = update.exit();
8
9 //update部分的处理方法是修改内容
10 update.text(function(d){
11 return d
12 })
13
14 //exit部分的处理方法是删除
15 exit.remove()
这段代码中，对于exit部分的处理方法是删除。删除之后，网页中将不会有多余的p元素，剩下来的每一个p元素都有数据与之对应。
最终，网页中的元素结构为 :
<p>100</p>
<p>200</p>
<p>300</p>
处理模板 ：
经过学习enter和exit的处理方法，我们知道了如何处理多余的数据和元素。但是，有时候我们在开发过程中不知道
是数据多还是元素多，该怎么办？ 其实，我们大可不必在意数组长度和元素数量。大多数情况下，update部分都是"更新元素属性"。
enter部分都是"添加元素并赋予初始属性"，exit部分都是"删除元素"。因此，无论数据和元素如何。其处理方法都是类似的。
因此，我们可归纳成一个处理模板，我们在开发过程中就不必理会数组长度和元素数量之间的关系。模板代码 :
1 var dataList = [100,200.300];
2 var p = d3.select("#body")
3 .selectAll("p")
4
5 //绑定数据后，分别返回update、enter、exit部分
6 var update = p.data(dataList);
7 var enter = update.enter();
8 var exit = update.exit();
9
10 //update部分的处理方法
11 update.text(function(d){
12 return d
13 })
14
15 // enter部分的处理方法
16 enter.append("p")
17 .text(function(d){
18 return d
19 })
20
21 // exit部分的处理方法
22 exit.remove()
如此，则不需要考虑网页中P元素是多以还是不足。无论是哪种情况，最终的结果必定是一个P元素对应数组中一个项，没有多余的。上面的模式，就是为模板。在数据需要经常更新时很常用。