在这里，我正在尝试更改图像svg的颜色。
<button>
<img src="someImage.svg">
</button>
是否可以按角度5更改按钮中svg图像的颜色
答案 0 :(得分：3)
如果SVG在DOM中是内联的，则可以将CSS应用于SVG。实现此目的的最简单方法是使用SVG注射器。它使用Javascript加载外部SVG文件，并用SVG标记替换HTML元素（通常为public class Test {
public static void main(String[] args) {
//Already created objects
List<Foo> foos0 = Arrays.asList(new Foo("A"));
//However I need to apply some modification on them, that is dependent on themselves
//1. Returning same object
List<Foo> foos1 = foos0.stream().map(Test::modifyValueByReturningSameObject).collect(Collectors.toList());
//2. Creating new object
List<Foo> foos2 = foos0.stream().map(Test::modifyValueByCreatingNewObject).collect(Collectors.toList());
//3. Modifying param
foos0.stream().forEach(Test::modifyValueByModifyingParam);
}
//Lets imagine that all methods below are somehow dependent on param Foo
static Foo modifyValueByReturningSameObject(Foo foo) {
foo.setValue("fieldValueDependentOnParamFoo");
return foo;
}
static Foo modifyValueByCreatingNewObject(Foo foo) {
Foo newFoo = new Foo("fieldValueDependentOnParamFoo");
return newFoo;
}
static void modifyValueByModifyingParam(Foo foo) {
foo.setValue("fieldValueDependentOnParamFoo");
return;
}
}
public class Foo {
public String value;
public Foo(String value) {
this.value = value;
}
public String getValue() {
return value;
}
public void setValue(String value) {
this.value = value;
}
}
元素）。
如果您使用SVGInject（https://github.com/iconfu/svg-inject/），则HTML将如下所示：
<img>图像加载后，<button>
<img src="someImage.svg" onload="SVGInject(this)">
</button>
属性通过替换onload元素起到了神奇的作用。它看起来应该一样，但是您可以将CSS应用于SVG。
答案 1 :(得分：0)
我从http://www.petercollingridge.co.uk/tutorials/svg/interactive/javascript/中获取了一些代码 您必须使用object元素而不是img元素。您必须给您的object元素指定一个id（在示例中为“ svg-object”）。您必须给svg文件中的按钮指定一个ID（在示例中为external-1）。然后，您可以更改样式
var svgObject = document.getElementById('svg-object').contentDocument;
var svg = svgObject.getElementById('external-1');
svg.style.fill = "green"
内嵌svg稍微容易一些，但可以做到。