어떻게 같은 <strong>객체</strong> 태그에 SVG (잉크 스케이프 사진)을 놓고 잉크 스케이프

Question

에서 긴 스타일을 조작하는이

<div class='rbis-svg-row'> 
    <div class='rbis-salta-svg'> 
     <object id='svg1' data='factory4-network-salta.svg' type='image/svg+xml' width='900px'> 
    </object> 
    </div> 
</div> 

그때와 SVG의 요소에 액세스 할 수 있습니다

<script> 
    document.getElementById("svg1").addEventListener("load", function() { 
     var doc = this.getSVGDocument(); 
     var rect = doc.querySelector('#rectABC'); 
     // Id for an object is rectABC                        

     var theStyle = reg.getAttribute('style'); 

    }); 

</script> 

그러나!

스타일은

"color:#000000;cliprule:nonzero;display:inline;overflow:visible;\ 
visibility:visible;opacity:0.58999999;isolation:auto;\ 
mix-blend mode:normal;colorinterpolation:sRGB;\ 
color-interpolationfilters:linearRGB;solid-color:#000000;\ 
solid-opacity:1;fill:#fcaf3e;fill-opacity:1;fill-rule:nonzero;\ 
stroke:#000000;stroke-width:3;stroke-linecap:round;\ 
stroke-linejoin:miter;stroke-miterlimit:4;\ 
stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;\ 
marker:none;color-rendering:auto;image-rendering:auto;\ 
shape-rendering:auto;text-rendering:auto;enable-background:accumulate" 

스타일의 단일 속성을 변경하는 어떤 좋은 방법이 있나요 꽤 긴? 아니면 문자열을 추출하고 문자열을 조작해야합니까?

/gh

Answer 1

HTML의 경우와 같은 방법으로 사용할 수 있습니다. style 객체의

element.style.fill = "red"; 

하지 않는 것이 스타일 속성은 항상 XML 속성과 동일한 이름이 없습니다. 속성에 하이픈이 있으면 속성에 낙타 사례 이름이 지정됩니다. 예를 들어 fill-opacity 속성은 다음과 같이 변경할 수 있습니다.

element.style.fillOpacity = 1;