我一直在按照使用JavaScript访问SVG元素的示例进行尝试,但是我无法使其正常工作。这段代码有什么问题?
Javascript:
var objTag = document.getElementById('esc-seconds-1s');
objTag.addEventListener('load', function() {
var svgDoc = objTag.contentDocument;
var cc3 = svgDoc.getElementById('cc3');
cc3.setAttribute('fill', 'red');
}, false);
我遇到了以下控制台错误:
Uncaught SecurityError: Failed to read the 'contentDocument' property from 'HTMLObjectElement': Blocked a frame with origin "null" from accessing a frame with origin "null". Protocols, domains, and ports must match.
我认为错误有点误导。错误来自contentDocument行,所以我不认为是由于同源策略。此外,我的SVG文件中没有任何xlink行。这是我的SVG顶部:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
SVG显示正常,那么为什么objTag.contentDocument调用失败?html代码:
<object class="esc-seven-segment" id="esc-seconds-1s"
type="image/svg+xml" data="images/seven-segment-digit.svg"></object>
感谢您,
-Andres