在SVG中，我们无法给Text元素设置Width和Height属性，因此无法直接获取Text元素的高和宽。如果想要给Text元素添加背景色，最简单的办法就是在Text元素的下面添加Rect，然后给Rect设置fill属性。如下面的代码：

     
     
      2014-09-11
     

　　显示效果 

　　但是如果Text元素的字体改变了，如何修改Rect元素的Width和Height属性的值呢？一个简单的办法是通过Text元素的getBBox()方法获取高和宽，代码如下：

var textElement = d3.select("#dateObj_0");var bBox = textElement.getBBox();d3.select("#dateRectObj_0").attr("width", bBox.width).attr("height", bBox.height);

　　有关d3.js的使用可以查看官网. getBBox()方法返回指定元素的最小边界，

　　不过在Firefox浏览器上，该方法偶尔会返回'NS_ERROR_FAILURE'的错误。原因是当目标元素的display属性被设置为'none'时，Firefox认为此时无法获取到元素的边界值（元素没有在浏览器中渲染，因此返回值没有任何意义）。不过经测试IE和Chrome浏览器能正常工作。解决的办法不外乎是在调用该方法前先判断目标元素的display属性是否为'none'。