实践一下。
<!DOCTYPE html>
<body>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<div id="enter"></div>
<div id="exit">
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</div>
</body>
<script src="d3.v3.min.js" charset="UTF-8"></script>
<script>
var dataset = [{id: 3, name: 'Leo'},
{id: 6, name: 'Jacky'},
{id: 9, name: 'Mike'}];
var p = d3.select("body").selectAll("p");
var update = p.data(dataset
.filter(function(d,i){
if (d.id > 3) {
return true;
} else {
return false;
}
})
.sort(function(a,b) {
return b.id - a.id;
}));
var enter = update.enter();
var exit = update.exit();
update
.each(function(d, i) {
d.age = d.id + 23;
})
.text(function(d){return d.id + " age:" + d.age + " " + d.name;});
enter.append("p").text(function(d){return d;});
exit.remove();
</script>