Question

我编写了以下代码，它成功地增加了svg行的大小，但未能减小它的大小。以下是代码：

	
	var x = function(a,s){
		var line = document.getElementById('l1');
		if (s > line.getAttribute(a) ) { // if s i greater
				for (var i = line.getAttribute(a); i<=s;i++ ){
				line.setAttribute(a, i);
				}
		};

		if(s < line.getAttribute(a)){
				for (var i = line.getAttribute(a); i<s;i-- ){
				line.setAttribute(a, i);
				}
		};

	};
  
  x('x2', 400); // changes the width of the svg 
  x('x2', 40); // fail

<html>

<body>

	<svg heigth="210" width="500" id="svg1" >

		<line id="l1" x1="0" y1="50" x2="100" y2="50" style="stroke:rgb(250,30,0); stroke-width:2"/>
	</svg>	


</body>
</html>

你可以看到它能够增加它的宽度但是不能减少它吗？

我对i<s和i--中的第二个if语句感到困惑，我认为存在所有错误（可能没有）

如果你能解释一下你的答案，那将是非常友好的，这样不仅对我而且对其他人也有用。

谢谢！

Answer 1

有效

if(s < line.getAttribute(a)){
                for (var i = line.getAttribute(a); i > s;i-- ){ //changes here
                line.setAttribute(a, i);
                }
        };

http://jsfiddle.net/4xnpn3wj/

如何动态更改svg行的宽度

1 个答案: