JS一起学05：Date对象、封闭空间、函数传参和封装、获取非行间样式、字符串操作

一、Date对象 1. 获取 oDate.getFullYear() 获取年份 oDate.getMonth()+1  获取月份 0-11----->1-12 oDate.getDate() 获取日 1－31 var arr=['日','一','二','三','四','五','六']; var oDate=new Date();   oDate.getHours() 获取小时    oDate.getMinutes() 获取分    oDate.getSeconds() 秒     alert(oDate.getMillisecons());   //毫秒 oDate.getDay() 获取星期几 0－6     0：星期天 例：数码时钟     (1)获取系统时间----Date 对象----getHours、getMinutes、getSeconds (2)  显示系统时间----字符串连接、空位补零 (3) 字符串[下标]获取一个字符，不兼容IE6/7，所以，设置图片路径。charAt方法----字符串.charAt(下标)兼容 2. 时间戳 oDate.getTime()----从1970年1月1日到现在的毫秒数 61秒＝ parseInt61/60 分 61%60 秒 3. 设置 （1）setFullYear(年，月，日 ) 年：必填 月日：可选-----获取完整的年份 setYear(); 获取年 （2）setMonth(月，日) 月：必填 （3）setDate(日)                 oDate.setDate(31);  //如果本月只有30天，会直接到下月第一天                 oDate.setDate(0);  上个月最后一天                 oDate.setDate(30);                 alert(oDate.getDay()); 本月最后一天星期几 oDate.setMonth(oDate.getMonth()+1); //设置下个月1号 // 因为本月是11月，getMonth()获取到的是10，所以要获取到11才是下个月 oDate.setDate(0); alert(oDate.getDay()); （4）setHours(小时，分，秒，毫秒) 后面三个可选 例子：本月第一天是周几，本月共有多少天 var oDate=new Date(); oDate.setDate(1); var week=oDate.getDay(); alert('本月第一天是周'+week); oDate.setMonth(oDate.getMonth()+1); oDate.setDate(0); var day=oDate.getDate(); alert('本月的总天数是：'+day); 例：倒计时 window.οnlοad=function(){ var oSpan=document.getElementsByTagName('span')[0]; tick(); setInterval(tick,1000); function tick(){ var oDate=new Date();    var oDateTarget=new Date(); oDateTarget.setFullYear(2014,11,1);   //注意此处月份应设置比目标小1 oDateTarget.setHours(0,0,0,0); var s=parseInt((oDateTarget.getTime()-oDate.getTime())/1000); var d=parseInt(s/86400); s%=86400; var H=parseInt(s/3600); s%=3600; var M=parseInt(s/60); s%=60; oSpan.innerHTML="距离2014年12月1日"+d+"天"+H+"时"+M+"分"+s+"秒"; } } date对象的另外的用法-----设置时间可以进位、退位 二、封闭空间 1. 定时器中的括号问题： setInterval(show,1000);    //此处的show不能加括号，如果加则变成立刻执行，执行完之后，返回undefined function show(){ alert(1); } js中语法规范：大括号不能直接跟小括号，如下： function show(){ alert(1); }() 但是，如果这样即可： (function (){ alert(1); })()    /相当于立刻执行这个函数。如果后面再加show(); 则会报错 函数每调用一次，就复制一份，就执行一次 2. 封闭空间：多人配合时，避免函数重名问题     (fn1)();  //立即执行的匿名函数 例一：两个局部变量a不会重名，在两个不同的作用域下 function fn1(){     var a=44;     alert(a); } fuction fn2(){     var a=55;     alert(a); } 例二： (function(){     var a=55;     alert(a); })();   //立即执行的匿名函数   封闭空间    这个函数只能用一次 例三： var a=12; function aaa(){  a=5; } aaa(); alert(a); (function bbb(){  a=34; })(); alert(a);     //先后弹出5、34 利用封闭空间写选项卡 var oBox=document.getElementById('box'); var aBtn=oBox.getElementsByTagName('input'); var aDiv=oBox.getElementsByTagName('div'); for(var i=0;i<aBtn.length;i++){     (function(index){         aBtn[i].οnclick=function() {              for(var i=0;i<aDiv.length;i++) {                   aBtn[i].className='';                  aDiv[i].className='';             };             this.className='active';             aDiv[index].className='active';        };      })(i); } //function fn(index){ };     fn(i); 同(function(index){ })(i); 利用封闭空间写选项卡----封装 var oBox=document.getElementById('box'); var aBtn=oBox.getElementsByTagName('input'); var aDiv=oBox.getElementsByTagName('div'); tab(0); tab(1); tab(2); function tab(index){         aBtn[i].οnclick=function() {              for(var i=0;i<aDiv.length;i++) {                   aBtn[i].className='';                  aDiv[i].className='';             };             this.className='active';             aDiv[index].className='active';        };      } 求和函数： （1）参数数量不固定的时候可用 （2）参数数组不是一个真正的数组，所以它不能用数组的方法 window.οnlοad=function(){     function fn(){         var num=0;         for(var i=0;i<arguments.length;i++){             num+=arguments[i];         }     }     fn(222,33,456); } 三、函数传参和封装 1.参数的基本知识： (1)参数可以省 可以不传 (2)在调用函数的括号里传 在定义函数的括号里收 (3)参数名可以自定义 不用带引号 (4)可以传多个参数 中间用逗号分隔  (5)可以传多类型 2. 可变参（不定参）：arguments 参数的个数可变，参数数组。参数数组，  有下标，有length,但并不是真正的数组，所以它不能用数组的方法。 3. 例1：求和-----求所有参数的和(用arguments) 例子： function sum(){ //alert(arguments.length); for(var i=0; i<arguments.length; i++){ result=0; result+=arguments[i]; } return result; } alert(sum(12,6,8)); 4. 例2：CSS函数 (1)判断arguments.length (2)给参数取名，增强可读性  四、获取非行间样式（不能用来设置）： （1）obj.currentStyle[attr]-----IE浏览器支持 （2）getComputedStyle(obj,false)[attr]------Chrome、fire fox、IE9、IE10 ···false处，可以随便放任何值，如果不放则不兼容firefox低版本。如果不写第二个参数，不兼容firefox低版本；放false显得专业而已 只能取单一样式，不能取复合样式 获取样式：css(oDiv,'width') 设置样式：css(oDiv,'width','200px') 例一：获取样式封装 window.οnlοad=function(){ var oBox=document.getElementById('box'); oBox.οnclick=function(){ var w=parseInt(getStyle(this,'width')); this.style.width=w+100+'px'; var oSpanH=getStyle(document.getElementById('s1'),'height'); } } function getStyle(obj,attr){  return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj,false)[attr];   //var 和 return 必须写在行首 } 例二：函数封装和随机数配合使用 window.οnlοad=function(){ var oBox=document.getElementById('box'); oBox.οnclick=function(){ var w=parseInt(getStyle(oBox,'width')); var r=rnd(10,100); w+=r; oBox.style.width=w+'px'; } } function rnd(n,m){ return parseInt(Math.random()*(m-n+1)+n); } 例三：卷起广告 window.οnlοad=function(){ var oBox=document.getElementById('box'); function fn(){ var timer=setInterval(function(){ var h=parseInt(getStyle(oBox,'height'))-10; if(h<=0){ clearInterval(timer); oBox.style.display='none'; } oBox.style.height=h+'px'; },30) } setTimeout(fn,3000); } function getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[attr]; }else{ return getComputedStyle(obj,false)[attr]; } } 五、字符串操作 1、截取字符串    (1) str.charAt(0)通过下标获取字符串第几位   兼容 str.substring(1)只传一个参数。从开始到最后 (2) str.substring(1,3)截取字符串【alert(name.ssubstring(name.lastIndexOf('.')+1));】 两参数：第一个是开始，第二个是结束位置  但不包括结束位置 str.substring(n);  截取字符串，从参数n开始到最后 2.  indexOf(); indexOf()   查找字符串，返回下标，无论是输入两个还是输入词组，都只找第一个字符的下标；如果没有，则返回-1；   应用：浏览器独有的信息 window.navigator.userAgent;    找不到返回-1 if(copy.indexOf('MSIE 6.0')==-1){alert('不是IE6');} var win=window.navigator.userAgent;   //返回字符串 判断浏览器信息： var win=window.navigator.userAgent.toLowerCase(); if(win.indexOf('Chrome')!=-1){      alert('chrome'); } else if(win.indexOf('Firefox')!=-1){       alert('f'); } else if(win.indexOf('MSIE')){       alert('ie'); } else{   alert('其它'); } 例一： function findSame(arr,n){     if(arr.indexOf){         return arr.indexOf(n);     }     for(var i=0;i<arr.length;i++){         if(arr[i]==n){             return i;             }     }     return -1; } 3. lastIndexOf(); 从后面开始找，但同样返回下标 。 跟indexOf相反，是从后面开始找的，找不到也返回-1 应用：找一个字符串的文件扩展名 var string='a.b.cd.efg.c.d.fffd.png'; alert(string.substring(str.lastIndexOf('.')+1)); 4. 字符串拆分成数组---split( ) 5. 把英文字母转成大写/小写---toUpperCase()/toLowerCase(); alert(win.toUpperCase()); alert(win.toLowerCase()); var win=window.navigator.userAgent.toLowerCase(); 5. 字符串排序 英文：按照字典序              alert('f'<'g'); ---->true 字符串数字：按照字典序   alert('624'>'53')-->true   先比较左侧第一位 中文：乱

总结

以上是生活随笔为你收集整理的JS一起学05：Date对象、封闭空间、函数传参和封装、获取非行间样式、字符串操作的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。