退出（）删除（）不会删除过时的元素

Question

http://jsfiddle.net/brunoperel/z6qfttmr/

我试图创建即时要素，具体取决于该链接已经被点击：

d3.select('#processes').selectAll('.processLaunch').data(helperProcessesData).enter() 
    .append('a') 
     .classed('processLaunch', true) 
     .attr('href', 'javascript:void(0)') 
     .text(function(d) { return d.text; }) 
     .on('click', function(d) { 
      var currentProcess=d.name; 
      var filteredData = helperStepsData.filter(function(d) { return d.process === currentProcess; }); 

      var helperStepsForProcess = d3.select('div#helperContainer').selectAll('.helperStep') 
       .data(filteredData); 
      console.log('Filtered data : '+JSON.stringify(filteredData)); 
      console.log('Linked data : '+JSON.stringify(helperStepsForProcess.data())); 
      helperStepsForProcess.enter() 
       .append('div').text(function(d) { return 'Step '+d.step+' : '+d.title; }); 
      helperStepsForProcess.exit().remove(); 
    }); 

有（至少！）两件事情，我不明白这里：

• 我每次点击一个链接，相关的文本被添加到页面，但尽管我叫过时的甚至不删除.exit().remove()选择。为什么？
• 当我做一个console.log的数据将被绑定到选择的元素，它返回一个对象数组，这很好。但是，在此之后的行中，我检索已绑定到元素的数据，我得到一组undefined对象。为什么我不能获得一组对象呢？

Answer 1

我想你忘记了添加的台阶上相应的类：

helperStepsForProcess.enter() 
      .append('div') 
      .attr('class', 'helperStep'); 

helperStepsForProcess.text(function(d) { 
    return 'Step '+d.step+' : '+d.title; }); 

在拨弄添加此返回预期的结果。

我希望这有助于！

更新：https://jsfiddle.net/chroth/z6qfttmr/2/