Question

javascript 在函数内定义变量和在函数定义变量的区别问题，

想实现点击一个按钮，每点击一次就可以挪动外部的div框，定义dive left的时候在函数外部定义问什么就只能移动一次，在内部定义时就可以实现连续点击连续移动，很是想不通，代码如下：

代码1：
<div id="dd" style=
"width:500px;height:500px;border:1px solid blue;top:0px;left:50px;position:relative;">
</div>
<script language="javascript">

var divid=document.getElementById("dd");

var moveleft=divid.style.left.substring(0,divid.style.left.indexOf('p'));

function move(){

divid.style.left=parseInt(moveleft)+10+"px";

}
</script>
<input type='button' value='move' onclick='move()'>

代码2：
<div id="dd" style=
"width:500px;height:500px;border:1px solid blue;top:0px;left:50px;position:relative;">
</div>
<script language="javascript">

var divid=document.getElementById("dd");

function move(){
var moveleft=divid.style.left.substring(0,divid.style.left.indexOf('p'));
divid.style.left=parseInt(moveleft)+10+"px";

}
</script>
<input type='button' value='move' onclick='move()'>

Answer 1

放在外边的时候moveleft的值是不会变的，也就是最初的位置，它在页面最初加载完成的时候就已经确定了，所以移动的时候也就是从最初的位置开始，不管你点多少次，看上去就只会移动一次
放在里边的时候moveleft的值是获取的当前的位置，因此每次点击的时候会不停的移动