在浏览器加载SVG文件后,我将如何修改它,最好是通过jquery?一个简单的例子是按下一个按钮,SVG 元素的颜色就会改变。任何文档也会有所帮助。
编辑:这个链接帮助很大:w3.org/Graphics/SVG/IG/resources/svgprimer.html#SVG_in_HTML
在浏览器加载SVG文件后,我将如何修改它,最好是通过jquery?一个简单的例子是按下一个按钮,SVG 元素的颜色就会改变。任何文档也会有所帮助。
编辑:这个链接帮助很大:w3.org/Graphics/SVG/IG/resources/svgprimer.html#SVG_in_HTML
您不能“修改”SVG 文件(除非在服务器上更改它们)。SVG 文件定义了一组 SVG 对象,如果您愿意,每个对象都可以用 ID 标识。这些对象可以像处理任何 DOM 元素(例如 setAttribute 等)一样使用 JavaScript 进行操作。检查DOM 接口的http://www.w3.org/TR/SVG11/types.html#BasicDOMInterfaces。请注意,SVGElement 扩展了 Element,这是基本的 DOM 元素类型。
编辑:简单的例子:
<html>
<body>
<input type="button" onclick="doSVGThing()" value="change">
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<rect id="aRect" x="10" y="10" height="100" width="100"
style="stroke:#ff0000; fill: #9999ff"></rect>
</svg>
<script type="text/javascript">
function doSVGThing() {
var r = document.getElementById('aRect');
r.setAttribute('style', 'stroke: #00ff00; fill: #99ff99');
}
</script>
</body>
</html>