Question

我已经在一个简单的问题上挣了几个小时，尽管这里似乎已经有了描述：How to access SVG elements with Javascript

我无法访问嵌入标记中加载的外部svg文件的元素，即使我等待div或整个窗口加载（我已尝试了几个＆＃34;加载监听器＆＃ 34）

我已将我的html文件简化为几行，以向您展示问题：

<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Desperate demo</title>   
</head>
<body>

<div id="content">
    <embed class="emb" id="maptest" type="image/svg+xml" src="star.svg">
</div>
<script type='text/javascript'>
window.onload = initAll;
function initAll(){
    var mySVG = document.getElementById("maptest");
    var svgDoc = mySVG.contentDocument;
    console.log(svgDoc);
}
</script>
</body>
</html>

基本上，日志返回＆＃34; null＆＃34;或＆＃34;未定义＆＃34;在contentDocument属性调用上，好像在DOM中没有加载任何svg。

你能看到我错过了什么吗？如果我在我的html中编写整个svg标记而不是调用extern文件，它也无法工作......

Answer 1

尝试getSVGDocument()并查看它是否对您有所帮助：

window.onload = initAll;
function initAll(){
    var mySVG = document.getElementById("maptest");
    console.log(mySVG);
    var svgDoc = mySVG.getSVGDocument();
    console.log(svgDoc);
}

通过contentDocument

1 个答案: