iframe에 동적으로 추가 된 SVG가 올바르게 렌더링되지 않습니다.

Question

특히 IRI 참조 (예 : fill="url(#myLinearGradient)")가 작동하지 않는 것 같습니다. 여기

예 : http://jsfiddle.net/QYxeu/2/

스크린 (오른쪽은 iframe)는 :

선형 구배 오른쪽에 렌더링되지 않는다.

Chrome, Firefox에서이 문제가 발생하지만 이상하게도 Safari가 정상입니다.

누가 문제가 될 수 있고 어떻게 해결할 수 있는지 알고 있습니까?

Answer 1

이 문제는 iframe 문서를 한 번 열고 닫음으로써 해결할 수 있습니다. 일부 브라우저에서는 iframe의 콘텐츠 문서를 초기화해야 URL 조각을 해결할 수 있습니다.

var iframe = document.createElement('iframe'); 
document.body.appendChild(iframe); 
iframe.contentDocument.open(); 
iframe.contentDocument.close(); 

modified version of your example이 잘 작동합니다.