Question

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

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

svgDoc为空。（所以我无法通过JS访问svg的元素。）它应该工作，看this question.我做错了什么？如何获得SVG的contentDocument？

Answer 1

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

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

Answer 2

不确定这是否是答案，但对我有用。我遇到了同样的问题，svgObject返回了null：

var svgObject = document.getElementById('svgObject').contentDocument;

然后我想到我正在本地运行html页面：file：/// C：/wwwroot/App_dev/OverLay/Overlay03.html

从服务器运行它： http://localhost:62551/App_dev/OverLay/Overlay03.html

它工作正常，svgObject返回了内容，然后我可以将div放入其中。

JavaScript访问SVG的内部DOM

2 个答案: