Javascript 更改svg对象的颜色？

HTML:svg对象和脚本，它们应该更改svg对象的颜色，但由于某种原因它不会更改

<object id="object" type="image/svg+xml" data="play-pattern--light.svg"></object>

       <script type="text/javascript">
        window.onload=function () {

            var a = document.getElementById("object");
            var svgDoc = a.contentDocument;
            var styleElement = svgDoc.createElementNS("http://www.w3.org/2000/svg", "style");
            styleElement.textContent = ".st0 { fill: #000 }";
            svgDoc.getElementById("object").appendChild(styleElement);
        };

      </script>

window.onload=函数（）{
var a=document.getElementById（“对象”）；
var svgDoc=a.contentDocument；
var styleElement=svgDoc.createElements（“http://www.w3.org/2000/svg“，”风格“）；
styleElement.textContent=“.st0{fill:#000}”；
svgDoc.getElementById（“对象”）.appendChild（styleElement）；
};

我认为这就是为SVG对象着色所需的全部内容

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     width="160px" height="160px" viewBox="0 0 160 160" style="enable-background:new 0 0 160 160;" xml:space="preserve">
<style type="text/css">
    .st0{fill:#EDF5F5;}
</style>

.st0{fill:#edf5；}

需要一些指导为什么我的代码不工作，它还说了一个错误“UncaughtTypeError:无法读取null的属性'appendChild'”

谢谢

您应该使用：

svgDoc.documentElement.appendChild(styleElement);

而不是

svgDoc.getElementById("object").appendChild(styleElement);