如何在用作背景图像的外部SVG文件中设置路径元素的样式？

Question

我有一个在CSS中分配了背景图像的div。这是一个svg文件。有没有可能我可以访问路径来改变它们的颜色，即使它是一个背景图像？

Answer 1

您可以添加一个

<?xml-stylesheet type="text/css" href="svg-stylesheet.css" ?>    

指令，然后在样式表中定义样式。

参见http://www.w3.org/TR/SVG/styling.html#ReferencingExternalStyleSheets。

Answer 2

我不知道有什么方法可以访问外部链接的svg文件的路径(比如在img或object标记中)，但是如果您在页面中直接包含svg，您就可以访问这些路径，所以您可以创建一个具有相同宽度、高度和x，y位置的第二个div，在您的前台div下面给它一个z索引，并将svg xml放在后台div的旁边，您可以模拟您正在尝试做的事情。

下面的jsfiddle展示了如何使用JQuery通过get ajax请求加载svg图像，更改路径样式，然后将修改后的svg嵌入到后台div中：

http://jsfiddle.net/webchemist/j2Dgq/

编辑

jsfiddle更新后可以在IE9中工作，问题是对维基媒体的跨站点ajax请求，而不是内联svg...