形参，实参
形参：形式参数//fn(a,b,c)
实参：实际参数//fn(1,2,3);
arguments:实参的集合；是数组形式；与定义的形参无关；
<script>
function fn(a,b){
console.log(arguments);
}
fn('a',1,5,3);
</script>
//打印["a", 1, 5, 3]
当参数不固定时：
<script>
function fn(a,b){
var num=0;
for(var i=0;i<arguments.length;i++){
num+=arguments[i];
}
return num;
}
console.log(fn(3,1,5,3,3,3));//18;
console.log(fn(3,1,3,3));//10
</script>
运算符不同时：
<script>
function fn(){
var num=arguments[0];
if(arguments[arguments.length-1]=='+'){
for(var i=1;i<arguments.length-1;i++){
num+=arguments[i];
}
}else{
for(var i=1;i<arguments.length-1;i++){
num-=arguments[i];
}
}
return num;
}
alert(fn(1,2,3,'+'));//6
alert(fn(10,2,3,'-'));//5
</script>
setInterval
setInterval(function(){},1000);//通过累加间距来达到动画效果；
与getComputedStyle(obj).width一起使用；//获取当前的宽、、、
里面可以加回调函数，先执行left,在top；
不是能用for循环;
computed//计算后；得到的是一个字符串；
getComputedStyle(obj).width //标准浏览器下；
obj.currentStyle.width //ie浏览器下；current:当前的
获取样式，制作动画效果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div{
width:100px;
height:100px;
background:#f10180;
position:absolute;
top:60px;
left:10px;
}
</style>
</head>
<body>
<div></div>
<button>移动</button>
<script>
var oDiv=document.getElementsByTagName('div')[0];
var oBtn=document.getElementsByTagName('button')[0];
var timer=false;
// oDiv.onclick=function(){
// var width=getComputedStyle(oDiv).width;
// width=parseInt(width);
// oDiv.style.width=width+10+'px';
// }
// oBtn.onclick=function(){
// var left=getComputedStyle(oDiv).left;
// left=parseInt(left);
// oDiv.style.left=left+10+'px';
// }
oBtn.onclick=function(){
if(!timer){
domove(oDiv,'top',608);//timer为false时
}else{
clearInterval(timer);//timer为true时；清除定时器
timer=false;
}
}
function domove(obj,attr,taget){//封装函数
var position=getComputedStyle(obj)[attr];
position=parseInt(position);
timer=setInterval(function(){
position+=10;
if(position>taget){
position=taget;
}
obj.style[attr]=position+'px';
if(position==taget){
clearInterval(timer);//清除定时器
}
},100);
}
</script>
</body>
</html>
网友评论