学习blus老师js--深入JavaScript
Posted 有点懒惰的大青年
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了学习blus老师js--深入JavaScript相关的知识,希望对你有一定的参考价值。
1.函数传参
可变参(不定参):arguments
参数的个数可变,参数数组
例1.求和
求所有参数的和
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <script> function sum() { //alert(arguments.length); //alert(arguments[0]); //arguments var result=0; for(var i=0;i<arguments.length;i++) { result+=arguments[i]; } return result; } alert(sum(12, 6, 8, 6, 8, 6, 8, 6, 8, 6, 8, 6, 8, 6, 8, 6, 8, 6, 8, 6)); </script> </head> <body> </body> </html>
例子2:CSS函数
判断arguments.length
给参数取名,增强可读性
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>无标题文档</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>
2.取非行间样式:
取非行间样式(不能用来设置):
obj.currentStyle[attr] //IE
getComputedStyle(obj, false)[attr] //chrome / FF
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style> #div1 {width:200px; height:200px; background:red;} </style> <script> function getStyle(obj, name) { if(obj.currentStyle) //IE { return obj.currentStyle[name]; } else //chrome / FF { return getComputedStyle(obj, false)[name]; } } window.onload=function () { var oDiv=document.getElementById(\'div1\'); alert(getStyle(oDiv, \'backgroundColor\')); }; </script> </head> <body> <div id="div1"> </div> </body> </html>
但是要注意上面getStyle()存在的问题,这个只能取单一样式,如果要取复合样式,如上面的background,要使用\'backgroundColor\'
3.数组基础
1)添加、删除元素
添加
- push(元素),从尾部添加
- unshift(元素),从头部添加
删除
- pop(),从尾部弹出
- shift(),从头部弹出
2)插入、删除
splice
splice(开始, 长度,元素…)
先删除,后插入
- 删除
splice(开始,长度)
- 插入
splice(开始, 0, 元素…)
- 替换
<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>
3)排序、转换
排序
- sort([比较函数]),排序一个数组
排序一个字符串数组
排序一个数字数组
转换类
- concat(数组2)
连接两个数组
- join(分隔符)
用分隔符,组合数组元素,生成字符串
字符串split
<script> var arr=[\'float\', \'width\', \'alpha\', \'zoom\', \'left\']; arr.sort(); alert(arr); </script>
<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>
4.
----------
以上是关于学习blus老师js--深入JavaScript的主要内容,如果未能解决你的问题,请参考以下文章