码迷,mamicode.com
首页 > 编程语言 > 详细

javascript读书随笔 1

时间:2015-05-24 21:44:08      阅读:245      评论:0      收藏:0      [点我收藏+]

标签:

1.1 jQuery 的 noConflict 

 

 1 var _jQuery=window.jQuery  //window.jQuery可能是别的库的变量名,先用jQuery对象中的临时变量存下来---var _jQuery
 2 _$=window.$  //同上
 3 jQuery.extend({
 4     noConflict:function(deep){
 5         window.$=_$;
 6         if(deep){    //如果jQuery是需要深度让出全局变量名时,将noConflict函数传入一个参数,只要参数显示为true就将全局jQuery也放弃
 7             window.jQuery=_jQuery;  //给回原先的占有该变量的值
 8             return jQuery
 9         }
10     }
11 })

 

 

 

 

1.2 对象扩展

 

 1 function mix(target,source){
 2     var args=[].slice.call(arguments),  //将类数组对象argument转换成数组
 3     i=1,key,
 4     ride=typeof args[args.length-1] =="boolean" ?args.pop():true;  //typeof 首先判断它是否为boolean类型,如果是就将最后一个参数返回,如果不是就返回true,默认为覆盖同名参数
 5     if(args.length===1){   //上一步已经将是否覆盖同名布尔参数去除,如果剩下的只有一个参数时
 6        target= !this.window ? this : {}; //如果现在是在全局作用域下,就返回this---window对象;如果不是就返回一个空对象以接下来接受剩余一个参数的属性
 7        i=0;
 8     }
 9     while((source=args[i++])){  //将剩下的参数一个一个属性复制给target
10        for(key in source){
11           if(ride||!(key in target)){
12               target[key]=source[key];
13             }
14         }
15     }
16     return target;
17 }

 

1.3数组化

在浏览器中存在许多类数组对象 function.arguments,doucument.forms,form.elements,doucument.links等,有些库都存在一些数组化的函数

 1 var makeArray =function(array){
 2     var ret =[];   
 3     if(array!=null){  
 4        var i =array.length;  //获取array中的length属性,如果length属性为空,说明它不是类数组
 5        //window,String,function都有length属性,String为字符串长度,function为默认参数个数;array.setInterval判断是否array为window对象,虽然这不是最佳方式。
 6        if(i==null ||typeof array=== "string" || jQuery.isFunction(array)||array.setInterval)  
 7            ret[0]=array; //保证发挥的是数组
 8        else 
 9            while(i)
10                ret[--i]=array[i];
11     }
12     return ret;
13 }

1.4 类型判断

jQuery的type函数,通常判定一个函数类型的时候都运用toString函数

 1 class2type{}
 2 //将有可能的几种除了对象的类型放入一个class2type的对象中
 3 jQuery.each("Boolean Number String Function Array Date RegExpObject".split(" "), 
 4 function(i,name){
 5     class2type["[object"+name+"]"] = name.toLowerCase();
 6 });
 7 jQuery.type=function(obj){
 8     return obj==null?  //如果obj==null 因为NULL没有tostring方法,所以就直接调用String函数,
 9     String(obj) :
10     class2type[toString.call(obj)]|| "object";//如果调用tostring 为上面所写的对象属性返回相应的值,否则认为为objec
11 }

1.5 domReady实现

    window.ready=fn,这条语句是当所有资源已经完成,开始执行fn函数。

    在jQuery中运用$.(fn)可以多次使用,都会依次执行,且是当dom树构建完成时。

    判断dom树是否完成可以有四种方法

         (1)W3C中有一个DOMContentLoaded事件,监听这个函数执行函数,现在有许多浏览器都支持

         (2)对于ie可以用Diego Perini的hack

 1 (function (){
 2     try{
 3        document.documentElement.doScroll(‘left‘);//如果报错,说明还未执行完毕
 4     } 
 5     catch (e){
 6        setTimeout(arguments.callee,50);//50毫秒后重新执行函数
 7        return;
 8     }
 9     fireReady(); //要执行的函数
10 })();

         (3)对于ie还可以用script defer hack进行判定,但这不推荐,要加多有的script

1 document.write("<script id=_ie_onload defer src=//0><\/scr"+"ipt>");
2 script=document.getElementById("_ie_onload");
3 script.onreadystatechange=function(){ //ie即使是死链也能触发事件
4     if(this.readyState=="complete"){
5         fireready();//指定defer的script会在DOM树建完才触发
6     }
7 }

        (4)对于在firefox3.6之前可以用 判断document.documentElement是否为true来触发,和上面第二方法类似,不为true继续用setTimeout来循环调用判断

 

javascript读书随笔 1

标签:

原文地址:http://www.cnblogs.com/beika/p/4526427.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!