JavaScript accessing inner DOM of SVG

Question

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 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?

Answer 1

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);