无法使用Javascript更改SVG路径的属性值

Question

我使用snap.svg创建了一个SVG路径，你可以在下面看到它的代码。现在，我正在尝试更改属性的值，例如strokeWidth。为此，我创建了一个文本输入框和一个按钮，该按钮运行一个函数，该函数应为strokeWidth填充一个新值。但它不起作用。我做错了什么？有没有可能我甚至不能改变这个值？我还发布了输入框和按钮+我的函数的代码，用于在下面更改笔划宽度

我尝试了很多不同的函数和脚本，但似乎都不起作用。有时我会收到一条错误消息，有时却不会。当我收到错误消息时，它总是说函数未定义或L_PUF_WAR未定义。

var L_PUF_WAR = s.path("m 937.88689,516.10127 v -51.8831 H 573.37482 V 340.49692 H 391.11879 V 276.6408").attr({
                        fill: "none",
                        stroke: "#bada55",
                        strokeWidth: 15,
                        strokeDasharray: "30, 30 ,30"
                    });
                    A_PUF.append(L_PUF_WAR);```       

    <script>
        function hallo(){
            var number = document.getElementById("number").value;
            if(number > 0){
                L_PUF_WAR.strokeWidth = number;
            }
        }
    </script>
        <input type="text" id="number" name="number"/><br/>  
        <input type="button" value="breite" onclick="hallo()"/> 

I am expecting to put in a value for the strokewidth into the Input Box for example 20 and then the strokeWidth should change to that value..

Answer 1

尝试使用.setAttribute()

L_PUF_WAR.setAttribute("strokeWidth", number);