javascript - 使用 javascript 更改 svg 中所有元素的填充

Question

我想更改 SVG 中所有元素的填充颜色。元素都是矩形和多边形类型。我没有设置默认颜色。

这是一个示例文件：

http://www.kingoslo.com/instruments/test.svg

我怎样才能最优雅地做到这一点？

Answer 1

如果你有 jQuery：

$('svg').children().css('fill', '#ffffff');

编辑：请注意，这假设矩形和多边形是 svg 元素的直接子元素。

Answer 2

另一种类似于 Robert Longson 的变体：

document.documentElement.style.fill = 'blue';

我更喜欢 documentElement 而不是 rootElement，因为它在 DOM Core 中，而且它们几乎是相同的。

Answer 3

在使用具有大量嵌套元素的复杂 SVG 时，这对我有用：

$('svg').find('path, text').css('fill', '#ffffff')