JS小总结-CSDN博客

本文链接：https://blog.csdn.net/qq_28223305/article/details/53389965

HTML-------超文本语言

	文档声明
  	 <!DOCTYPE html>
 	  严格模式

--------------------------------------------------------------------------------------------------------

CSS---------层叠样式表

	盒子模型
   	width/height、border、padding（）

清楚浮动

1 . clearfix(可定义公共类使用。)

	    .clearfix:after {       
	    content: ".";     /*内容为“.”就是一个英文的句号而已。也可以不写。*/
	    display: block;   /*加入的这个元素转换为块级元素。*/
	    clear: both;     /*清除左右两边浮动。*/
	    visibility: hidden;      /*可见度设为隐藏。注意它和display:none;是有区别的。visibility:hidden;仍然占据空间，只是看不到而已；*/
	    line-height: 0;   
	    height: 0;   
	    font-size:0;  
		}

	 .clearfix { *zoom:1;}   /*这是针对于IE6的，因为IE6不支持:after伪类，这个神奇的zoom:1让IE6的元素可以清除浮动来包裹内部元素。*/

	2 clear:both/left/right

	3 overflow:hidden;       溢出隐藏

--------------------------------------------------------------------------------------------------------

事件绑定
addEventListener(事件名字,回调函数,true/false)    //这里 true 代表时间冒泡， false代表事件捕获
attachEvent(事件名字,回调函数)

--------------------------------------------

typeof        检测基本数据类型

instanceof        检测复合类型
      检测json不行

obj.constructor    检测构造函数
----------------------------------------------------

Date
   获取
      oDate.getFullYear()    获取年
      oDate.getMonth()      获取月，小1
      oDate.getDate()       获取日
      oDate.getDay()           获取星期
            星期日是0

      oDate.getHours()      获取小时
      oDate.getMinutes()        获取分钟
      oDate.getSeconds()        获取秒钟

      oDate.getTime()       获取时间戳
   设置
      oDate.setFullYear(y,m,d);
      oDate.setFullYear(y,m);
      oDate.setFullYear(y);

      oDate.setMonth(m,d);
      oDate.setMonth(m);

      oDate.setDate(d);

      oDate.setHours(h,m,s,ms);
      oDate.setHours(h,m,s);
      oDate.setHours(h,m);
      oDate.setHours(h);

      oDate.setMinutes(m,s,ms);
      oDate.setMinutes(m,s);
      oDate.setMinutes(m);

      oDate.setSeconds(s,ms);
      oDate.setSeconds(s);

      oDate.setTime();
-------------------------------------------------------------------------

       RegExp
         .test(str)

         new RegExp(规则,选项);
         /abc/img
         选项
            i  Ignore        忽略大小写
            m  Muti-line  多行
            g  Global        全局

         量词
            {n,m}     最少n个，最多m个
            {n,}      最少n个，最多不限
            {n}       n个

            +        最少一次最多不限
               {1,}
            *        无所谓
               {0,}
            ?        出现一次，或不出现
               {0,1}

         转义
            \w           英文数字_
            \d           数字
            \s           空白     

            \W           除了英文数字_
            \D           除了数字
            \S           除了空白

            .        所有字符

            \.           字符串.

      检验座机
         区号-号码
         3-4位      0开头，第二位不是0
         7-8位      第一位不能是0

         0[1-9]\d{1,2}
         \-
         [1-9]\d{6,7}

         /^0[1-9]\d{1,2}\-[1-9]\d{6,7}$/
------------------------------------------------
开定时器会返回开的顺序

如果后台一次性传递给前端50万条数据，怎么处理？
   setTimeout
   闭包

------------------------------------------------
闭包
   子函数可以使用父函数的变量

   生命周期
      只要子函数还有用,整条作用域链上的变量都不会消失

   作用域链
      var a = 12;
      function show(){
         //var a = 5;
         document.onclick = function(){
            //var a = 3;
            alert(a);
         };
      }
      show();

      现在自身函数找，如果找不到，找上一级，直到找到全局。
----------------------------------------------------------------------------------------------

   添加事件
   $('input').on('click',function(){});
   委托
   $('ul').on('click','li',function(){

   });
   $('input').off();     解绑

   交互
      ajax
      $.ajax({
         url:'',
         type:'',
         data:{},
         success:function(){},
         error:function(){}
      });

      jsonp
      $.ajax({
         url:,
         dataType:'jsonp',
         jsonp:'cb',
         data:{},
         success:fn,
         error:fn
      });

扩展
   自定义组件
   $.fn.xxx = function(){};
   $.fn.extend({
      xxx:fn,
      xxx:fn
   });

----------------------------------------

存储
      cookie                    localStorage
传输     随着每次的请求发到服务器   本地存储
大小     4KB                   5MB
生命周期   有，默认是session       没有生命周期
用法     麻烦                    so easy

1.如何使用？
   cookie
      setCookie(name,value,iDay);
      getCookie(name);
      removeCookie(name);
   localStorage
      设置
         localStorage.name = value;
      获取
         localStorage.name;
      删除
         delete localStorage.name;

      获取出来都是字符串

      序列化(持久化)
         对象-》字符串
         var str = JSON.stringify(obj);
      反序列化(反持久化)
         字符串-》对象
         var obj = JSON.parse(str);

      存 
         序列化
      取
         反序列化

      eval('('+str+')');
      new Function('return '+str)();
      JSON.parse(str);

2.什么时候使用？
   cookie
      记住我，换肤
   localStorage
      cookie能做的localStorage也能做，并且容量更大。

localStorage         本地存储
sessionStorage           会话存储
   特性基本一样，用法一模一样。
   sessionStorage只要会话结束就没了。

================================================
js中     this
this是什么，不看定义，看调用。
优先级
高
   new          object
   定时器          window
   事件           触发事件的对象
   方法           方法属于的那个对象
   正常调用      window||undefined
低

只管一层
看最后的调用
---------------------------------------------------