在IE中获取未定义的svg-tag结果的innerHTML

Question

我在使用Internet Explorer中的javascript获取svg-tag的html内容时遇到了一些麻烦.

我的javascript代码如下:

console.log($('.icon')[0].innerHTML);

和我在html文档中的标记:

<svg class="icon"><use>testing</use></svg>

这适用于Chrome,Firefox和我们有什么,但在Internet Explorer中我留下了一个未定义的错误.这是我的Javascript和jQuery的混合？

为什么我似乎无法获取我的svg-tag的内容？我尝试了一些不同的东西,经常我得到一个"SCRIPT5007:无法设置未定义或空引用的属性'innerHTML'"

帮帮我:)谢谢你!

Answer 1

如何使用XMLSerializer.以某种方式获得元素,然后这样做......

console.log(new XMLSerializer().serializeToString(element));

Answer 2

Internet Explorer目前不支持innerHTMLSVG Elements上的方法.但是,我们在内部打开了一个问题,以跟踪我们对此功能的考虑.与此同时,我会探索替代解决方案,例如InnerSVG polyfill,据称可以在Internet Explorer 9及更高版本中使用.

Answer 3

最终我找到了某种解决方案。也许是一种黑客方式？但至少对我有用。

而不是获取原始的innerhtml，而我在IE 中无法获取该原始innerhtml。我尝试通过这样做来获取 svg 标签内的每个元素节点：

var element = document.getElementsByTagName('svg')[0].childNodes;
for (i = 0; i < element.length; i++) {
    if (element[i].nodeName != '#text') {
        console.log(element[i]);
    }
}