可缩放矢量图形（SVG）：getBBox（）在internet explorer 10中不工作

我使用以下代码获取边界框的宽度：

document.getElementById("dataId").getBBox().width;

这将返回具有输入id的边界框的宽度。 这在所有浏览器（Chrome、firefox21、IE7）中都可以正常工作，但在IE10中却不行。 在IE10中，它向我返回0的值

这是我在JSFIDLE中创建的示例。请检查一下。

---

我很好奇IE10和svg getBBox方法之间是否存在任何兼容性问题，请务必让我知道这方面是否存在任何问题。

正如中的规范所引用的，我认为是这样的

请注意，getBBox必须在调用方法时返回实际的边界框，即使元素尚未渲染

“即使在元素尚未呈现的情况下”似乎是IE的症结所在，这个问题在一年后的IE11上仍然存在。根据我的经验，我能看到的唯一的另一种可能性是，根据规范，g标记没有明确的宽度和高度，IE可能完全放弃了这个检查，因为在“ToNothaveWidth”中，IE代码基的0大概是相同的

因此，解决办法是边走边找最大的孩子。在您的特定情况下，作为一种解决方法，您可以在将

lastChild

添加到g标记时抓取它。将fiddle中的JS代码更改为这个（我也修复了thomasw在评论中提到的svgns）

---

正如您所见，这只是我在

lastChild

中更改的最后一行，在

getBBox（）

之前，它应该像Firefox和您的其他浏览器那样提醒8而不是0。

您的小提琴有一个错误，您没有定义

svgns

。修复该错误后，我只能确认我安装的IE10似乎没有报告包含

的

的正确边界框。但是，请求文本元素本身的边界框似乎与预期的一样有效。也许这可以为您提供一个解决方案？事实上，我在IE9+上运行了使用.getBBox的应用程序，所有的计算似乎都可以正常工作。

var temp;
temp = document.createElementNS("http://www.w3.org/2000/svg","text");
temp.appendChild(document.createTextNode(".."));
temp.setAttribute("x",38); 
temp.setAttribute("y",18);
document.getElementById("tata").appendChild(temp);
alert(document.getElementById("tata").lastChild.getBBox().width);