使用iframe方式引入的外部svg不能用js获取svg中的DOM元素（跨域时）

Question

使用iframe方式引入的外部svg不能用js获取svg中的DOM元素，是在跨域的情况下，不跨域时可以使用js正常获取svg里面的子元素

Answer 1

请问您解决了吗，我也遇到了这个问题，跨域的时候获取不到，网上啥资料也没有查到

Answer 2

iframe中文档对象只有在加载完成后才能够被获取，否则会返回null，你可以尝试以下方法：

/*注意：采用iframe获取svgDom时，
必须等到iframe加载完成后，
在调用document.getElementById('iframe').contentDocument获取svgDom，
否则会获取不到svgDom。*/

var iframe = document.getElementById('svgframe');//获取id为svgframe的iframe对象

 if (iframe.attachEvent) {

    iframe.attachEvent('onload', function () {

        alert('iframe is loaded')

    })

} else {

    iframe.onload = function () {

        //这里获取svgDom

        var iframeSvg = document.getElementById('svgframe').contentDocument;

        //接下来就可以对svgDom进行操作，绑定元素点击事件，改变元素的属性等等

        //给svg上id为‘VKnife1’的元素绑定点击事件

        iframeSvg.getElementById('VKnife1').addEventListener('click', function () {

            //点击事件操作

            alert("点击开关");

        })

    }

}