JavaScript 访问 SVG 的内部 DOM [英] JavaScript accessing inner DOM of SVG

问题描述

test.php 是一个用 PHP 生成的 SVG 对象.

test.php is a SVG object that's being generated with PHP.

<object data="test.php" type="image/svg+xml" id="SVG" />
<script>
    var mySVG = document.getElementById("SVG");
    var svgDoc = mySVG.contentDocument;

svgDoc 为空.(所以我无法通过 JS 访问 svg 的元素.)它应该可以工作，看看 这个问题.我做错了什么?如何获取我的 SVG 的 contentDocument?

svgDoc is null. (and so I can't access the elements of the svg via JS.) It should work, looking at this question. What am I doing wrong? How can I get the contentDocument of my SVG?

推荐答案

您需要等到 SVG 加载完毕，然后才能访问 contentDocument:

You need to wait until the SVG is loaded and than you can access the contentDocument:

 var mySVG = document.getElementById("SVG");
 var svgDoc;
 mySVG.addEventListener("load",function() {
      svgDoc = mySVG.contentDocument;
      alert("SVG contentDocument Loaded!");
 }, false);

这篇关于JavaScript 访问 SVG 的内部 DOM的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！