如果您使用JavaScript动态生成SVG,则可以内联使用它。不要使用:
<svg id="mysvg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="1000" width="1000">
<rect id="myrect" x="0" y="0" rx="0" ry="0" width="200" height="300" fill="yellow" stroke="purple" stroke-width="5" />
</svg>
你写:
<script>
var svg = document.createElementNS( "http://www.w3.org/2000/svg", "svg" );
svg.setAttribute( "xmlns", "http://www.w3.org/2000/svg/" );
svg.setAttribute( "xmlns:xlink", "http://www.w3.org/1999/xlink" );
svg.setAttribute( "height", "1000" );
svg.setAttribute( "width", "1000" );
document.body.appendChild( svg );
var rect = document.createElementNS( "http://www.w3.org/2000/svg", "rect" );
rect.setAttribute( "id", "myrect" );
rect.setAttribute( "x", "0" );
rect.setAttribute( "y", "0" );
rect.setAttribute( "rx", "0" );
rect.setAttribute( "ry", "0" );
rect.setAttribute( "width", "200" );
rect.setAttribute( "height", "300" );
rect.setAttribute( "fill", "yellow" );
rect.setAttribute( "stroke", "purple" );
rect.setAttribute( "stroke-width", "5" );
svg.appendChild( rect );
</script>
虽然不是最理想的,但似乎能够正常工作。