（一）函数传参：
向函数传不定参（使用arguments数组）
例一：求和
<script type="text/javascript">
function sum()
{
var result=0;
for(var i=0;i<arguments.length;i++)
{
result+=arguments[i];
}
return result;
}
alert(sum(12,35,56));
</script>
例二：类似css获取行间样式函数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<script type="text/javascript">
function css(obj,name,value)
{
if(arguments.length==2) //如果传入两个参数，则获取属性值
{
return obj.style[name];
}
else{ //如果传入三个参数，则修改属性值
obj.style[name]=value;
return obj['style'][name];
}
}
window.onload=function()
{
var oh1=document.getElementById('h1');
// alert(css(oh1,'font-size')); //输出h1标签内的字体大小
alert(css(oh1,'font-size','25px')); //修改h1标签内的字体大小并输出
}
</script>
<body>
<h1 id="h1" style="font-size:15px;">你好</h1>
</body>
</html>
例三：获取非行间样式函数
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style type="text/css"> h1{font-size: 20px;} </style> <script type="text/javascript"> function getStyle(obj,name) { if(obj['currentStyle']) //如果能够使用currentStyle获取样式（低版本的火狐，谷歌浏览器不能获取，不兼容） { return obj['currentStyle'][name]; } else{ return getComputedStyle(obj,null)[name]; //通过该函数获取样式（低版本IE浏览器不能获取，不兼容） } } window.onload=function() { var oh1=document.getElementById('h1'); alert(getStyle(oh1,"font-size")); //不能获取符合属性（如font，background等） } </script> <body> <h1 id="h1" >你好</h1> </body>
（二）数组：
1，length可以设置值，也可以获取数组的长度。当数组的length为6，赋值为3，则数组的内容会变成三个元素。
2，添加元素，删除元素：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style type="text/css"> h1{font-size: 20px;} </style> <script type="text/javascript"> var array=['张三','李四','王五','赵六','钱七','孙九']; alert("数组元素："+array); //array=['张三','李四','王五','赵六','钱七','孙九'] array.length=3; alert("修改length后结果："+array); //array=['张三','李四','王五'] array.push('赵六','钱七'); //push()在数组的尾部添加元素 alert("添加数组尾部元素(赵六,钱七)后结果："+array); //array=['张三','李四','王五','赵六','钱七'] array.pop('钱七'); //pop()删除数组的尾部元素 alert("删除数组尾部元素(钱七)后结果："+array); //array=['张三','李四','王五','赵六'] array.unshift('孙九','钱七'); //unshift()在数组的头部添加元素 alert("添加数组头部部元素(孙九,钱七)后结果："+array); //array=['孙九','钱七','张三','李四','王五','赵六'] array.shift('孙九'); //shift()删除数组的头部元素 alert("删除数组头部元素(钱七)后结果："+array); //array=['钱七','张三','李四','王五','赵六'] </script> <body> </body> </html>
3，用split添加，删除，修改元素
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style type="text/css"> h1{font-size: 20px;} </style> <script type="text/javascript"> var array=['张三','李四','王五','赵六','钱七','孙九']; alert("数组元素："+array); array.splice(3,2); //splice(起点，长度)，array.splice(3,2)是从array[3]开始删除2个元素 alert("用splice删除(赵六,钱七)："+array); //array=['张三','李四','王五','孙九'] array.splice(2,0,'赵六','钱七'); //splice(起点，长度为0，添加的元素) alert("用splice在王五前添加(赵六,钱七)："+array); //array=['张三','李四','赵六','钱七','王五','孙九'] array.splice(2,3,'王五','赵六','钱七'); //splice(起点，长度为n，修改的n个元素) alert("用splice将('赵六','钱七','王五')修改为('王五','赵六','钱七')："+array); //array=['张三','李四','王五','赵六','钱七','孙九'] </script> <body> </body> </html>
4，连接两个数组：数组1.concat（数组2）
5，数组元素输出添加间隔符：数组名.join（'间隔符'）
6，对数组元素排序：sort（fun）：fun必须是函数，规定排序顺序，可以为空。当为空时，按照ASCII字符顺序排序。排序会修改原数组元素顺序。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style type="text/css"> h1{font-size: 20px;} </style> <script type="text/javascript"> var array1=['张三','李四','王五']; var array2=['赵六','钱七','孙九']; /* 连接两个数组操作： */ var array=array1.concat(array2); //前数组.concat(后数组) array1.concat(array2)将array1,array2连接,array1在前,array2在后 alert(array); //array=['张三','李四','王五','赵六','钱七','孙九'] /* 数组元素输出添加间隔符操作： */ alert(array.join('->')); //输出结果：张三->李四->王五->赵六->钱七->孙九 /* 数组元素排序（任何语言，数字都能升序排序）： */ //array=['zhangsan','lisi','wangwu','zhaoliu','qianqi','sunjiu']; //array=[111,1,11,12,7,123,89]; if(!isNaN(parseInt(array[0]))) //如果数组中存的是数字 { array.sort(function(n1,n2){return n1-n2;}); } else{ array.sort(function(n1,n2){return n1.localeCompare(n2);}); //如果数组中存的是英文单词或其他语言 //如果是中文，则按照拼音首字母a->z排序 //n1.localeCompare(n2)排序非英语类语言 } alert(array); </script> <body> </body> </html>
function(n1,n2)
{
if(n1>n2) return 负数;
else if(n1<n2) return 正数;
else return 0;
}
（三）定时器：
1，开始定时器：
tim1=setInterval(函数名fun，n)：每个n毫秒执行一次函数fun，循环执行无数次
tim2=setTimeout（函数名fun，n）：间隔n毫秒执行一次函数fun，只执行一次
2，关闭定时器：
clearInterval（tim1）：关闭定时器time1
clearTimeout（time2）：关闭定时器time2
3，获取现在的时间：var date=new Date(); date.getHours()：date.getMinutes()：date.getSeconds()获取n点n分n秒
#获取的月份要+1；获取的星期：0代表周天，1代表周一...
例如：显示特色时钟（万年历）：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style type="text/css"> #time img{ width: 50px; height: 50px; } #year img{ width: 30px; height: 30px; } #time{ width: 500px; height: 60px; font-size: 50px; color: black; } #year{ width: 600px; height: 60px; font-size: 20px; color: black; } </style> <script type="text/javascript"> function toTime(n) { if(n<10) return '0'+n; else return ''+n; } function toYear(years,months,days) { var ymd=' '; if(months>10&&days>10){ ymd=years.toString()+months.toString()+days.toString(); } else if(months<10&&days>10){ ymd=years.toString()+'0'+months+days.toString(); } else if(months>10&&days<10){ ymd=years.toString()+months.toString()+'0'+days; } else{ ymd=years.toString()+'0'+months+'0'+days; } return ymd; } window.onload=function() { showTime(); setInterval(showTime,1000); function showTime() { var year=document.getElementById('year'); var time=document.getElementById('time'); var imgTime=time.getElementsByTagName('img'); var imgYear=year.getElementsByTagName('img'); var date=new Date(); var time=toTime(date.getHours())+toTime(date.getMinutes())+toTime(date.getSeconds()); var year=toYear(date.getFullYear(),date.getMonth()+1,date.getDate()); var week=date.getDay().toString(); for(var i=0;i<8;i++) { imgYear[i]['src']="./img/数字"+year.charAt(i)+".png"; } imgYear[8]['src']="./img/星期"+week+".png"; imgYear[8]['style']['width']="50px"; imgYear[8]['style']['height']="50px"; for(var i=0;i<imgTime.length;i++) { imgTime[i]['src']="./img/数字"+time.charAt(i)+".png"; } } } </script> <body> <div id="year"> <img src="./img/数字0.png"> <img src="./img/数字0.png"> <img src="./img/数字0.png"> <img src="./img/数字0.png"> 年 <img src="./img/数字0.png"> <img src="./img/数字0.png"> 月 <img src="./img/数字0.png"> <img src="./img/数字0.png"> 日 <img src="./img/星期1.png"> </div> <div id="time"> <img src="./img/数字0.png"> <img src="./img/数字0.png"> : <img src="./img/数字0.png"> <img src="./img/数字0.png"> : <img src="./img/数字0.png"> <img src="./img/数字0.png"> </div> </body> </html>
4，获取div的左边距，上边距，宽度，高度：
div.offsetLeft div.offsetTop div.offsetwidth div.offsetheight
5，实现内容向左滚动和向右滚动
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style type="text/css"> *{ margin: 0; padding: 0; } img{ width: 62px; height: 100px; } #div3{ width: 248px; height: 100px; margin: 20px auto; position: relative; /*设置为相对定位*/ background-color: red; overflow: hidden; /*设置div框外的元素看不见*/ } #div4{ width: 197px; height: 30px; margin: 150px 44% 0px ; } #div5{ width: 197px; height: 30px; margin: 0 44% 0px ; } #div3 ul{ left: 0; top: 0; position: absolute; /*设置为绝对定位，移动整个ul*/ } #div3 ul li{ width: 62px; height: 100px; float: left; list-style: none; /* 将li内容之前的点去掉 */ } </style> <script type="text/javascript"> window.onload=function() { var div3=document.getElementById('div3'); var div4=document.getElementById('div4'); var div5=document.getElementById('div5'); var inl=document.getElementById('inl'); var btl=document.getElementById('btl'); var inr=document.getElementById('inr'); var btr=document.getElementById('btr'); var ul=div3.getElementsByTagName('ul')[0]; var li=ul.getElementsByTagName('li'); var speed=0; btl.onclick=function() /*如果输入速度，点击向左移动*/ { speed=parseInt(inl.value); if(isNaN(speed)) alert('请输入向左移动速度'); else speed=-speed; move(); inr.value=0; } btr.onclick=function() { speed=parseInt(inr.value); if(isNaN(speed)) alert('请输入向右移动速度'); else move(); inl.value=0; } ul.innerHTML=ul.innerHTML+ul.innerHTML; /*设置ul中有两倍个ui(4*2个li)*/ ul.style.width=li[0].offsetWidth*li.length+'px'; /*设置ul的宽为n个li的宽相加*/ function move() { if(ul.offsetLeft<-(ul.offsetWidth/2)) /*如果ul走完(ul的左边距小于半个ul的宽4个li)，则将ul拖回原处*/ ul.style.left='0'; else if(ul.offsetLeft>0) ul.style.left=-ul.offsetWidth/2+'px'; else ul.style.left=ul.offsetLeft+speed+'px'; } var timer=setInterval(move,30); div3.onmouseover=function() /*当鼠标移入滚动内容，则停止滚动*/ { clearInterval(timer); } div3.onmouseout=function() /*当鼠标移出滚动内容，则继续滚动*/ { timer=setInterval(move,30); } } </script> <body> <div id="div4"> <input type="text" id="inl"> <input type="button" value="向左走" id="btl"> </div> <div id="div3" > <ul> <li><img src="./img/数字1.png"></li> <li><img src="./img/数字2.png"></li> <li><img src="./img/数字3.png"></li> <li><img src="./img/数字4.png"></li> </ul> </div> <div id="div5"> <input type="text" id="inr"> <input type="button" value="向右走" id="btr"> </div> </body> </html>