一、函数的返回值
（1）什么是函数的返回值？
函数的返回值就是函数的执行结果
可以没有return
（2）一个函数应该只返回一种类型的值
二、函数传参
（1）可变参（不定参）：arguments。arguments是一个数组，存了所有的参数。
参数的个数可变，参数数组
（2）例子1：求和
求所有参数的和
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>arguments</title>
<script>
function sum()
{
//alert(arguments.length);
//alert(arguments[0]);
var result=0;
for(var i=0;i<arguments.length;i++)
{
result+=arguments[i];
}
return result;
};
alert(sum(12,6,8));
</script>
</head>
<body>
</body>
</html>
（3）例子2：CSS函数
判断arguments.length
给参数取名，增加可读性
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS函数</title>
<script>
function css()
{
if(arguments.length==2)//获取
{
return arguments[0].style[arguments[1]];
}
else
{
arguments[0].style[arguments[1]]=arguments[2];
}
};
window.onload = function ()
{
var oDiv=document.getElementById(‘div1‘);
//alert(css(oDiv,‘width‘));
css(oDiv,‘background‘,‘green‘);
};
</script>
</head>
<body>
<div id="div1" style="width:200px; height:200px; background:red;">
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS函数2</title>
<script>
function css(obj,name,value)
{
if(arguments.length==2)//获取
{
return obj.style[name];
}
else
{
obj.style[name]=value;
}
};
window.onload = function ()
{
var oDiv=document.getElementById(‘div1‘);
alert(css(oDiv,‘width‘));
//css(oDiv,‘background‘,‘green‘);
};
</script>
</head>
<body>
<div id="div1" style="width:200px; height:200px; background:red;">
</div>
</body>
</html>
（4）取非行间样式（不能用来设置）：
obj.currentStyle[attr]
getComputedStyle(obj.false)[attr]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>取非行间样式2</title>
<style>
#div1{
width:200px;
height:200px;
background:red;
}
</style>
<script>
window.onload = function()
{
var oDiv=document.getElementById(‘div1‘);
//alert(oDiv.style.width);//style只能去行间的样式，非行间的动不了
//alert(oDiv.currentStyle.width);//currentStyle用来获取非行间的样式，但是只有IE浏览器可以弹出来，与火狐谷歌浏览器不兼容
//针对谷歌、火狐浏览器，但是在IE7下又不支持了
//alert(getComputedStyle(oDiv,false).width);
//alert(oDiv.currentStyle);
if(oDiv.currentStyle)
{
//IE
alert(oDiv.currentStyle.width);
}
else
{
//火狐、谷歌
alert(getComputedStyle(oDiv,false).width);
}
};
</script>
</head>
<body>
<div id="div1">
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>取非行间样式3</title>
<style>
#div1{
width:200px;
height:200px;
background:red;
}
</style>
<script>
//为了方便，不用每次调用都使用if-else，可以专门设置一个函数，作为一个公共的函数
function getStyle(obj,name)
{
if(obj.currentStyle)
{
return obj.currentStyle[name];
}
else
{
return getComputedStyle(obj,false)[name];
}
};
window.onload = function()
{
var oDiv=document.getElementById(‘div1‘);
alert(getStyle(oDiv,‘width‘));//可以将公共函数直接拿过来用
};
</script>
</head>
<body>
<div id="div1">
</div>
</body>
</html>
非行间样式的一些小问题
在CSS中有复合样式，比如background,border
还有单一样式，比如width,height,position
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>取非行间样式4</title>
<style>
#div1{
width:200px;
height:200px;
background:red;
}
</style>
<script>
//为了方便，不用每次调用都使用if-else，可以专门设置一个函数，作为一个公共的函数
function getStyle(obj,name)
{
if(obj.currentStyle)
{
return obj.currentStyle[name];
}
else
{
return getComputedStyle(obj,false)[name];
}
};
window.onload = function()
{
var oDiv=document.getElementById(‘div1‘);
//alert(getStyle(oDiv,‘background‘));//background是复合样式，但是currentStyle和getComputedStyle无法取出复合样式
alert(getStyle(oDiv,‘backgroundColor‘));
};
</script>
</head>
<body>
<div id="div1">
</div>
</body>
</html>
三、数组基础
（1）数组的使用
定义
var arr=[12,5,8,9];
var arr=new Array(12,5,8,9);
没有任何差别，[]性能略高，因为代码短
（2）数组的属性
length
既可以获取，又可以设置
例子，快速清空数组，直接让arr.length=0；
（3）数组使用原则
数组中应该只存在一种类型的变量，要么都存数字要么都存字符串
四、添加、删除元素
（1）数组的方法
添加
push（元素），从尾部添加
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数组添加</title>
<script>
var arr=[1,2,3]
arr.push(4);
alert(arr);
</script>
</head>
<body>
</body>
</html>
unshift(元素)，从头部添加
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数组添加2</title>
<script>
var arr=[1,2,3]
arr.unshift(4);
alert(arr);
</script>
</head>
<body>
</body>
</html>
删除
pop（），从尾部弹出
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数组删除</title>
<script>
var arr=[1,2,3]
arr.pop();
alert(arr);
</script>
</head>
<body>
</body>
</html>
shift（），从头部弹出
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数组删除2</title>
<script>
var arr=[1,2,3]
arr.shift();
alert(arr);
</script>
</head>
<body>
</body>
</html>
五、从中间插入、删除
splice
splice(开始，长度，元素...)
先删除后插入
删除
splice(开始，长度)
插入
splice(开始，0，元素)
替换
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数组script</title>
<script>
var arr=[1,2,3,4,5,6];
//删除数组中的元素：splice(起点的位置,长度)
//arr.splice(2,3);
//在数组中插入元素：splice(起点的位置,长度,元素...)
//arr.splice(2,0,‘a‘,‘b‘,‘c‘);
//替换
arr.splice(2,2,‘a‘,‘b‘);
alert(arr);
</script>
</head>
<body>
</body>
</html>
六、排序、转换
排序
sort([比较函数])，排序一个数组
排序一个字符串数组
排序一个数字数组
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数组排序</title>
<script>
var arr=[‘float‘,‘width‘,‘alpha‘,‘zoom‘,‘left‘];
arr.sort();
alert(arr);
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数组排序2数字</title>
<script>
var arr=[12,,8,99,19,112];
//比较函数
arr.sort(function(n1,n2){
return n1-n2;
/*if(n1<n2)
{
return -1;
}
else if(n1>n2)
{
return 1;
}
else
{
return 0;
}*/
});
alert(arr);
</script>
</head>
<body>
</body>
</html>
转换类
concat(数组2)
连接2个数组
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数组连接</title>
<script>
var a=[1,2,3];
var b=[4,5,6];
//alert(a.concat(b));
alert(b.concat(a))
</script>
</head>
<body>
</body>
</html>
join(分隔符)
用分隔符，组合数组元素，生成字符串
字符串split
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>join</title>
<script>
var arr=[1,2,3,4];
alert(arr.join(‘-‘));
</script>
</head>
<body>
</body>
</html>
原文：http://www.cnblogs.com/zhy2017/p/6351893.html