精简你的jQuery

在做一些要求较高的应用时(比如移动web),要求尽最大可能减小页面传输的数据,如果项目中在用jquery的话,感觉jquery好多功能其实也用不上,就算加载压缩版也有90多K,所以有必要对其精简,去除用不上的特性。

目前网上找到的解决办法有两个:

一、使用jQuip

jQuip 是目的是将 jQuery 项目拆分成各个小模块,根据需要包含相应的 JS 模块,以减小浏览器加载 JS 的大小。

核心文件 jquip.js 只有 4.28KB (最小化和gzip压缩过) 只有 jQuery 的 13%

该核心库已经包含 jQuery 中最常用的功能,其他的功能可通过插件方式引入。在 IE7 以及之前版本的 IE 上速度提升 7~8 倍。

详情参见jQuery 精简版 jQuip

二、使用Zepto.js

Zepto.js 是支持移动WebKit浏览器的JavaScript框架,具有与jQuery兼容的语法。2-5k的库,通过不错的API处理绝大多数的基本工作。

详情参见移动JavaScript框架 Zepto.js

三、自己写原生JavaScript代码吧……

顺便贴上一个好用的Ajax类

function Ajax(recvType){
 
    var aj=new Object();
    aj.recvType=recvType ? recvType.toUpperCase() : 'HTML';  //向形参中传递的文件类型
     aj.targetUrl='';
    aj.sendString='';
    aj.resultHandle=null;
 
    /*创建XMLHttpRequest对象*/
    aj.createXMLHttpRequest=function(){
        var xmlHttp = false;
        if(window.XMLHttpRequest){ //在非IE中创建XMLHttpRequest对象
            xmlHttp = new XMLHttpRequest();
        }else if(window.ActiveXObject){
            try{
                xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); //按新版IE创建
            }catch(error1){ //创建失败
                try{
                    xmlHttp = new ActiveXobject("Microsoft.XMLHttp"); //按老版IE创建
                }catch(error2){ //创建失败
                    xmlHttp = false;
                }
            }
        }
        return xmlHttp;
    }
 
    aj.XMLHttpRequest=aj.createXMLHttpRequest();
 
    /*处理服务器的响应*/
    aj.processHandle=function(){
        if(aj.XMLHttpRequest.readyState == 4){
            if(aj.XMLHttpRequest.status == 200){
                if(aj.recvType=="HTML")
                    aj.resultHandle(aj.XMLHttpRequest.responseText);
                else if(aj.recvType=="XML")
                    aj.resultHandle(aj.XMLHttpRequest.responseXML);
            }
        }
    }
 
    /*定义使用get方法传递的方法*/
    aj.get=function(targetUrl, resultHandle){
        aj.targetUrl=targetUrl;    
 
        if(resultHandle!=null){
            aj.XMLHttpRequest.onreadystatechange=aj.processHandle;    
            aj.resultHandle=resultHandle;    
        }
        if(window.XMLHttpRequest){
            aj.XMLHttpRequest.open("get", aj.targetUrl);
            aj.XMLHttpRequest.send(null);
        }else{
            aj.XMLHttpRequest.open("get", aj.targetUrl, true);
            aj.XMLHttpRequest.send();
        }
 
    }
 
    /*定义使用post方法传递的方法*/
    aj.post=function(targetUrl, sendString, resultHandle){
        aj.targetUrl=targetUrl;
 
        if(typeof(sendString)=="object"){
            var str="";
            for(var pro in sendString){
                str+=pro+"="+sendString[pro]+"&";    
            }
            aj.sendString=str.substr(0, str.length-1);
        }else{
            aj.sendString=sendString;
        }
 
        if(resultHandle!=null){
            aj.XMLHttpRequest.onreadystatechange=aj.processHandle;    
            aj.resultHandle=resultHandle;    
        }
 
        aj.XMLHttpRequest.open("post", targetUrl);
        aj.XMLHttpRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        aj.XMLHttpRequest.send(aj.sendString);
 
    }
 
    return aj;
}


使用方法:

<script src="ajax.js"></script>
<script language="javascript" type="text/javascript">
    var ajax=Ajax();
 
    /*get使用方式*/
    ajax.get("server.php?name=zhangsan&phone=778", function(data){
        alert(data); //data为从服务器端读取的数据
    });
    /*第一种post使用方式*/
    ajax.post("server.php", "name=ligang&phone=222", function(data){
        alert(data);
    });
    /*第二种post使用方式*/
    ajax.post("server.php", {name:"tom",phone:"456"},function(data){
        alert(data);
    });
</script>



文章出自:http://www.wumii.com/item/UDNdyQf7


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值