无法更改SVG元素的类名称 [英] Unable to change class name of SVG element
问题描述
我想通过单击按钮来更改应用于SVG的类.该代码是此处.
I want to change the class applied on an SVG with the click of a button. The code is here .
我的SVG看起来像:
<svg id="test" class="fill" xmlns="http://www.w3.org/2000/svg" width="100%" height="200px" >
<path id="path22276" d="m500 81c-41-6-110-35-110-46 0-6 32 6 48 19 8 5 53 12 101 14 78 4 93 1 144-22 32-14 60-26 64-26 8 0-37 34-62 47-28 15-131 22-185 14z"/>
</svg>
我尝试了以下两个代码:
I tried both the below code :
document.getElementById("test").className = "halffill";
document.querySelector("svg.fill").setAttribute("class","halffill");
我针对普通的div标签测试了相同的javascript代码.工作正常. SVG有一些限制吗?请帮我解决这个问题.
I tested the same javascript code against a normal div tag. It worked fine. Is there some restriction on SVG? Please help me figure this out.
推荐答案
问题是将javascript 加载类型设置为onload，从而使函数在加载主体时调用，而不是在<按钮的c1>.
The problem was the javascript load type was set to onload that made the function call on load of the body instead of onclick of the button.
解决方案:您可以在javascript部分的右上方看到一个齿轮图标.单击它，然后将加载类型更改为无包裹 < head>
Solution: You can see a gear icon on the top-right of javascript section. Click on it and change the load type to No wrap -in <head>
这篇关于无法更改SVG元素的类名称的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
