<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>数组笔记</title>
<script type="text/javascript">
// arguments 可变参数,arguments是一个数组,用于存放函数所接收的参数,也就是
// arguments[0]表示第一个参数,这样函数就不用指定有多少参数,而是可以根据不同数量的传参做不同的事情
// function sum(){
// alert(arguments.length); //返回3
// alert(arguments[0]); //返回12
//
// var result=0; //用arguments实现一个可变参数的和函数
// for(var i=0;i<arguments.length;i++){
// result=result+arguments[i];
// }
// return result;
// }
// alert(sum(12,4,6));
// function css(){ //arguments用法举例二:根据不同的参数个数,函数提供不同的操作
// if(arguments.length==2){ //如果参数个数为2,就获取指定元素的样式
// return arguments[0].style[arguments[1]];
// }
// else{
// arguments[0].style[arguments[1]]=arguments[2];
// }
// }
// oDiv=document.getElementById('div1');
// alert(css(oDiv,'width')); //返回200px;
// alert(css(oDiv,'background','green')); //背景就变成绿色啦
//上述函数也可以改写成下面的样子,具有更好的易读性
// function css(obj,name,value){ //arguments用法举例二:根据不同的参数个数,函数提供不同的操作
// if(arguments.length==2){ //如果参数个数为2,就获取指定元素的样式
// return obj.style[name];
// }
// else{
// obj.style[name=value;
// }
// }
// oDiv=document.getElementById('div1');
// alert(css(oDiv,'width')); //返回200px;
// alert(css(oDiv,'background','green')); //背景就变成绿色啦
//如何取非行间样式
// oDiv=document.getElementById('div1');
// alert(oDiv.currentStyle.width); //只支持IE
// alert(getComputedStytle(oDiv,false).width); //支持Chrome,FF
//getComputedStytle(oDiv,false)第一个参数表示你想要获取的元素名称,第二个参数随便写个什么都行,没啥用
//如何解决获取非行间样式浏览器的兼容性问题,主要用到if else结构,很多解决兼容性问题的方法基本都用这个结构
// if(oDiv.currentStyle){ //在非IE浏览器下,oDiv.currentStyle是undefined
// //IE
// alert(oDiv.currentStyle.width);
// }
// else{
// //Chrome FF
// alert(getComputedStytle(oDiv,false).width);
// }
// }
//注:以上方法只能获取单一样式,比如 width,height,不能获取复合样式,比如:background,如果想要获得背景颜色
//要写成:backgroundColor
//数组的使用 以下两种方法是等价的,常用第一种
// var arr=[12,4,7];
// var arr1=new Array(12,4,7);
//数组的属性 length 既可以获取又可以设置
// alert(arr.length); //返回3
// arr.length=0; //数组元素被清空
// arr.length=1; //数组中只剩下第一个元素
//添加、删除数组元素
// arr.push(5); //从尾部添加,返回arr[12,4,7,5]
// arr.unshift(5); //从头部添加,返回arr[5,12,4,7]
// arr.pop(); //删除尾部的第一个元素,返回arr[12,4]
// arr.shift(); //删除头部的第一个元素,返回arr[4,7]
// //数组的方法之 splice()
// var arr=[1,2,3,4,5,6];
// //删除:splice(起点,长度)
// arr.splice(2,3); //返回 arr[1,2,6] 这里删除了第二个位置(包含第二个位置)之后的三个元素
// //插入 splice(起点,长度,元素)
// arr.splice(2,0,'a','b','c'); //返回arr[1,2,a,b,c,3,4,5,6] ,先从第二个位置删除了0个元素,再从第二个位置插入元素
// arr.splice(2,3,'a','b','c'); //返回arr[1,2,a,b,c,6] 也可以看作是替换操作
//数组排序 sort();默认是可以将字符串进行排序,但是如果要给数字进行排序的时候,要带一个排序函数作为参数
//字符串排序
// var arr=['float','width','alpha'];
// alert(arr.sort()); //返回 alpha,float,width
//数字排序
// var arr=[12,33,2,109];
// arr.sort(function(n1,n2){
// return n1-n2;
// })
//数组的连接,contact()
// var arr1=[1,2,3];
// var arr2=[a,b,c];
// alert(arr1.contact(arr2)); //返回 1,2,3,a,b,c
// alert(arr2.contact(arr1)); //返回 a,b,c,1,2,3
//join分隔符,用分隔符分隔元素,生成字符串
// var arr=[1,2,3];
// alert(arr.join('-')); //返回1-2-3 最后得到的是一个字符串
</script>
<style>
#div1 { //非行间样式
width=200px;
height=200px;
background=red;
}
</style>
</head>
<body>
<!-- 行间样式 -->
<div id='div1' style="width:200px;height:200px;background:red;"></div>
</body>
</html>