近期写的一个javascript工具库
Post by
yaohuaq
  2010-11-16 19:12:07 Tuesday Tags:javascript,工具

jQuery 压缩后的也有70KB吧，如果你想要个小于10KB（压缩版的4KB左右）的，能和jQuery一样解决常用的javascript问题的工具，下面的这个工具我想可能是你要找的。

这个工具已经应用到我的blog了，可以参考下。

这一版还有几点需要继续优化的呢，下一版会实现链式继承。

工具里的方法名和jQuery类似，当然实现的功能也是一样的，都是一些常用的方法。 

 

 

 

 

选择器：C.$('#id .class tag');   //  C.$('#id_name'),这样可以获取到一个该ID节点的数组，C.$('#id_name .class_name'),这样可以获取到id_name 下 class为class_name节点的数组，C.$('h2') ,获取所有h2标签的节点数组

方  法：
       1: C.ready(fn)          //window.onload的解决方法，一个页面可以有N个C.ready方法，fn参数，传入一个函数即可。
 
       2: C.html(ele, [html])   //获取或设置html值。ele,操作的节点,html为空为获取该节点的html片段，反之就是设置该节点的html
  
       3: C.val(ele, [value])  //获取或设置value值。 ele,操作的节点,value为空为获取该节点的value，反之就是设置该节点的value
  
       4: C.css(ele,css)   //获取或设置CSS值。 ele,操作的节点,css为字符串时获取该节点的css值，为对象时就是设置该节点的css值
  
       5: C.attr(ele,attr)   //获取或设置属性。 ele,操作的节点,attr为字符串时获取该节点的属性值，为对象时就是设置该节点的属性值
  
       6: C.bind(ele,type,fn)   //绑定事件到某个节点。 ele,操作的节点,type为事件类型，fn为触发事件时执行的函数
　   
       7：C.unbind(ele,type,fn)　　//解除绑定的事件。
       
       8: C.each(obj,callback)   //遍历某个数组或对象，obj，遍历的数组或对象，callback，回调函数
  
       9: C.append(ele,node)   //将node节点作为ele节点的最后一个子节点，并插入。
  
       10: C.after(ele,node)   //在ele节点下一节点插入node节点
  
       11: C.remove(ele,[parent])   // 将ele节点删除，parent为ele的父节点，默认为document
  
       12: C.empty(ele)   // 将ele节点清空，注意和C.remove方法的区别。
  
       13: C.replace(ele,eleWith)   // 用eleWith节点替换掉ele节点
       
       14: C.ajax(obj) 　　　　// 异步数据ajax,obj作为一个对象参数传入,type可以为get或post
　　　　　　　　　　　　obj = {
　　　　　　　　　　　　　　　type:'get',
　　　　　　　　　　　　　　　url:'response.php',
　　　　　　　　　　　　　　　data:'mod=user&act=getUserInfo',
　　　　　　　　　　　　　　　sending:function()  alert('
　　　　　　　　　　　　　　　success:function(msg)   {alert(msg)}
 
  　　　　　　　　　　　　}
       15: C.trim(text)    // 过滤文本空格

先贴这吧

 

JavaScript代码
  1. /*!  
  2.  *CC JavaScript Library   
  3.  *http://www.c77cc.cn  
  4.  *Author:C7_yaohuaq(c77cc#vip.qq.com)  
  5.  *Date:2010-11-16  
  6.  */  
  7. (function() {   
  8.     var CC = function() {   
  9. ////////////////Public methods/////////////////////////////   
  10.         this.$ = function(selector) {   
  11.             if(typeof selector == 'object') {   
  12.                 return selector;   
  13.             }   
  14.             var selectors = selector.split(' ');   
  15.             if(selectors.length==1) {   
  16.                 return find(selectors[0]);     
  17.             }else if(selectors.length>1)  {   
  18.                 var re;   
  19.                 this.each(selectors,function(i) {   
  20.                     if(i==0) {   
  21.                         re = find(selectors[i]);   
  22.                     }else {   
  23.                         re = find(selectors[i],re);     
  24.                     }   
  25.                 });   
  26.                 return re;   
  27.             }else {   
  28.                 return null;   
  29.             }   
  30.         }   
  31.         this.ready = function(fn) {   
  32.             var done,exec,old_onload,load_events=[];   
  33.             var init = function() {   
  34.                 done = true;   
  35.                 while (exec = load_events.shift()) {   
  36.                     exec();   
  37.                 }                 
  38.             }              
  39.             if(document.addEventListener) {   
  40.                 document.addEventListener('DOMContentLoaded',init,false);   
  41.             }   
  42.             /*@cc_on @*/  
  43.             /*@if (@_win32)  
  44.             document.write("<script id=__ie_onload defer src=//0><\/scr"+"ipt>");  
  45.             script = document.getElementById("__ie_onload");  
  46.             script.onreadystatechange = function() {  
  47.             if (this.readyState == "complete")  
  48.                 init(); // call the onload handler  
  49.             };  
  50.             /*@end @*/  
  51.             old_onload = window.onload;   
  52.             window.onload = function() {   
  53.                 init();   
  54.                 if (old_onload) old_onload();   
  55.             };   
  56.             load_events.push(fn);              
  57.         }   
  58.   
  59.         //C.html(ele,[,elem]);   
  60.         this.html = function(ele,html) {   
  61.             if(html) {   
  62.                 if(ele.length==undefined) {   
  63.                     return ele.innerHTML = html;   
  64.                 }else if(ele.length>0) {   
  65.                     this.each(ele,function(i){   
  66.                         return ele[i].innerHTML = html;       
  67.                     });   
  68.                 }else {   
  69.                     return null;   
  70.                 }   
  71.             }else {   
  72.                 if(ele.length>0) {   
  73.                     ele = ele[0];   
  74.                 }   
  75.                 return ele.innerHTML;          
  76.             }   
  77.         }   
  78.         //C.val(ele[,value]);   
  79.         this.val = function(ele,value) {   
  80.             if(value) {   
  81.                 if(ele.length==undefined) {   
  82.                     ele.value = value;   
  83.                 }else if(ele.length>0) {   
  84.                     this.each(ele,function(i){   
  85.                         if(ele[i]!=null) {   
  86.                             ele[i].value = value;     
  87.                         }     
  88.                     });   
  89.                 }else {   
  90.                     return null;   
  91.                 }   
  92.             }else {   
  93.                 if(ele.length>0) {   
  94.                     ele = ele[0];   
  95.                 }   
  96.                 return ele.value;   
  97.             }      
  98.         }   
  99.                 //C.css(ele,css);   
  100.         this.css = function(ele,css) {   
  101.             if(typeof css == 'object') {   
  102.                 var cssText='',i,j;   
  103.                 for(i in css) {   
  104.                     cssText += i+':'+css[i]+';';   
  105.                 }   
  106.                 if(ele.length==undefined) {   
  107.                     return ele.style.cssText = cssText;   
  108.                 }else if(ele.length>0) {   
  109.                     this.each(ele,function(j){   
  110.                         if(ele[j]!=null && ele[j].nodeType==1) {   
  111.                             ele[j].style.cssText = cssText;    
  112.                         }      
  113.                     })   
  114.                 }else {   
  115.                     return null;   
  116.                 }   
  117.             }else if(typeof css == 'string') {   
  118.                 if(ele.length==undefined) {   
  119.                     return getStyle(ele,css);   
  120.                 }else if(ele.length>0) {   
  121.                     ele = ele[0];   
  122.                     return getStyle(ele,css);   
  123.                 }else {   
  124.                     return null;   
  125.                 }   
  126.             }      
  127.         }   
  128.   
  129.         //C.attr(elements,attr)   
  130.         this.attr = function(ele,attr) {   
  131.             if(typeof attr == 'object') {   
  132.                 if(ele.length==undefined) {   
  133.                     for(var i in attr) {   
  134.                         ele.setAttribute(i,attr[i]);   
  135.                     }   
  136.                 }else if(ele.length>0) {   
  137.                     this.each(ele,function(i){   
  138.                         for(var j in attr) {   
  139.                             ele[i].setAttribute(j,attr[j]);   
  140.                         }         
  141.                     });   
  142.                 }else {   
  143.                     return null;   
  144.                 }   
  145.             }else if(typeof attr == 'string') {   
  146.                 if(ele.length>0) {   
  147.                     ele = ele[0];   
  148.                 }   
  149.                 return ele.getAttribute(attr);   
  150.             }else {   
  151.                 return null;   
  152.             }   
  153.         }   
  154.   
  155.         //type是事件名称，要注意的是"onclick"要改为"click","onblur"要改为"blur",也就是说事件名不要带"on"。   
  156.         this.bind = function(ele,type,fn) {   
  157.             if(ele.length==undefined) {   
  158.                 bind(ele,type,fn);     
  159.             }else if(ele.length>0) {   
  160.                 this.each(ele,function(i){   
  161.                     bind(ele[i],type,fn);       
  162.                 })   
  163.             }else {   
  164.                 return null;   
  165.             }   
  166.         }   
  167.         this.unbind = function(ele,type,fn) {   
  168.             if(ele.length==undefined) {   
  169.                 unbind(ele,type,fn);     
  170.             }else if(ele.length>0) {   
  171.                 this.each(ele,function(i){   
  172.                     unbind(ele[i],type,fn);       
  173.                 })   
  174.             }else {   
  175.                 return false;   
  176.             }   
  177.         }   
  178.         //遍历对象或数组，callback为回调函数   
  179.         //C.each(obj[,callbck]);   
  180.         this.each = function(obj,callback) {   
  181.             var obj = obj || new Object();   
  182.             if(callback) {   
  183.                 for(var name in obj) {   
  184.                     callback.call(obj,name,obj[name]);   
  185.                 }   
  186.             }else {   
  187.                 return;    
  188.             }   
  189.         }   
  190.            
  191.         this.append = function(ele,node) {   
  192.             var fragment;   
  193.             if(ele.length==undefined) {   
  194.                 if(node.length==undefined) {   
  195.                     ele.appendChild(node);   
  196.                 }else if(node.length>0) {                      
  197.                     fragment = buildFragment(node);   
  198.                     ele.appendChild(fragment);   
  199.                 }   
  200.             }else if(ele.length>0) {   
  201.                 this.each(ele,function(i){   
  202.                     if(ele[i].nodeType==1) {                           
  203.                         if(node.length==undefined) {   
  204.                             if(i<this.length-1) {   
  205.                                 ele[i].appendChild(node.cloneNode(true));   
  206.                             }else {   
  207.                                 ele[i].appendChild(node);   
  208.                             }        
  209.                         }else if(node.length>0) {   
  210.                             fragment = buildFragment(node);    
  211.                             if (i<this.length-1){   
  212.                                 ele[i].appendChild(fragment.cloneNode(true));   
  213.                             }else {   
  214.                                 ele[i].appendChild(fragment);   
  215.                             }     
  216.                         }   
  217.                     }       
  218.                 });   
  219.             }   
  220.         }   
  221.   
  222.         this.before = function(ele,node) {   
  223.             if(ele.length==undefined) {   
  224.                 if(node.length==undefined) {                   
  225.                     before(ele,node);   
  226.                 }else if(node.length>0) {   
  227.                     var fragment = buildFragment(node);   
  228.                     before(ele,fragment);   
  229.                 }   
  230.             }else if(ele.length>0) {   
  231.                 this.each(ele,function(i){   
  232.                     if(node.length==undefined) {                   
  233.                         if(i<this.length-1) {   
  234.                             before(ele[i],node.cloneNode(true));   
  235.                         }else {   
  236.                             before(ele[i],node);   
  237.                         }      
  238.                     }else if(node.length>0) {   
  239.                         var fragment = buildFragment(node);   
  240.                         if(i<this.length-1) {   
  241.                             before(ele[i],fragment.cloneNode(true));   
  242.                         }else {   
  243.                             before(ele[i],fragment);   
  244.                         }   
  245.                     }   
  246.                 });   
  247.             }   
  248.         }   
  249.   
  250.         this.after = function(ele,node) {   
  251.             if(ele.length==undefined) {   
  252.                 if(node.length==undefined) {                   
  253.                     after(ele,node);   
  254.                 }else if(node.length>0) {   
  255.                     var fragment = buildFragment(node);   
  256.                     after(ele,fragment);   
  257.                 }   
  258.             }else if(ele.length>0) {   
  259.                 this.each(ele,function(i){   
  260.                     if(node.length==undefined) {                   
  261.                         if(i<this.length-1) {   
  262.                             after(ele[i],node.cloneNode(true));   
  263.                         }else {   
  264.                             after(ele[i],node);   
  265.                         }      
  266.                     }else if(node.length>0) {   
  267.                         var fragment = buildFragment(node);   
  268.                         if(i<this.length-1) {   
  269.                             after(ele[i],fragment.cloneNode(true));   
  270.                         }else {   
  271.                             after(ele[i],fragment);   
  272.                         }   
  273.                     }   
  274.                 });   
  275.             }   
  276.         }   
  277.         this.remove = function(ele,parent) {   
  278.             var parent = parent || document.body;   
  279.             if(ele.length==undefined) {   
  280.                 parent.removeChild(ele);   
  281.             }else if(ele.length>0) {   
  282.                 this.each(ele,function(i){   
  283.                     parent.removeChild(ele[i]);   
  284.                 });   
  285.             }   
  286.         }   
  287.         this.empty = function(ele) {   
  288.             if(ele.children.length>0) {   
  289.                 while(ele.children.length>0) {   
  290.                     for(var i in ele.children) {   
  291.                         if(ele.children[i]!=undefined && ele.children[i].nodeType==1) {   
  292.                             this.remove(ele.children[i],ele);   
  293.                         }   
  294.                     }   
  295.                 }   
  296.             }   
  297.         }   
  298.         this.replace = function(ele,eleWith) {   
  299.             var parent = ele.parentNode || document.body;   
  300.             if(ele.length==undefined) {   
  301.                 if(eleWith.length==undefined) {   
  302.                     parent.replaceChild(eleWith,ele);   
  303.                 }else if(eleWith.length>0) {   
  304.                     var fragment = buildFragment(eleWith);   
  305.                     parent.replaceChild(fragment,ele);   
  306.                 }   
  307.             }else if(ele.length>0) {   
  308.                 this.each(ele,function(i){   
  309.                     if(eleWith.length==undefined) {   
  310.                         if(i<this.length-1) {   
  311.                             parent.replaceChild(eleWith.cloneNode(true),ele[i]);   
  312.                         }else {   
  313.                             parent.replaceChild(eleWith,ele[i]);   
  314.                         }      
  315.                     }else if(eleWith.length>0) {   
  316.                         var fragment = buildFragment(eleWith);   
  317.                         if(i<this.length-1) {   
  318.                             parent.replaceChild(fragment.cloneNode(true),ele[i]);   
  319.                         }else {   
  320.                             parent.replaceChild(fragment,ele[i]);   
  321.                         }   
  322.                     }   
  323.                 });                
  324.             }   
  325.         }   
  326.         this.ajax = function(arg) {   
  327.             var xmlHttp;   
  328.             if(window.ActiveXObject) {   
  329.                 xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');   
  330.             }else {   
  331.                 xmlHttp = new XMLHttpRequest();   
  332.             }   
  333.             if(!xmlHttp) alert('初始化XMLHttpRequest失败');   
  334.             if(arg.type.toLowerCase()=='post') {   
  335.                 xmlHttp.open("POST",encodeURI(arg.url),true);   
  336.                 xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");   
  337.                 xmlHttp.send(encodeURI(arg.data));   
  338.                 xmlHttp.onreadystatechange = function() {   
  339.                     if(xmlHttp.readyState==1 && arg.sending!=undefined) {   
  340.                         arg.sending();   
  341.                     }else if(xmlHttp.readyState==4 && xmlHttp.status==200){   
  342.                         arg.success(xmlHttp.responseText);   
  343.                     }   
  344.                 }   
  345.             }else{   
  346.                 xmlHttp.open("GET",encodeURI(arg.url+'?'+arg.data),true);   
  347.                 xmlHttp.onreadystatechange = function() {   
  348.                     if(xmlHttp.readyState==1 && arg.sending!=undefined) {   
  349.                         arg.sending();   
  350.                     }else if(xmlHttp.readyState==4 && xmlHttp.status==200){   
  351.                         arg.success(xmlHttp.responseText);   
  352.                     }   
  353.                 }   
  354.                 xmlHttp.send(null);   
  355.             }   
  356.   
  357.         }   
  358.   
  359.         this.trim = function(text) {   
  360.             return (text || "").replace(/^\s+|\s+$/g,'');      
  361.         }   
  362. ////////////////Static methods/////////////////////////////       
  363.         var find = function(selector,parents) {   
  364.             var parents = parents || document,elems=[];   
  365.             if(parents.length==undefined) {   
  366.                 if(selector.indexOf('#')==0) {   
  367.                     return getId(selector.substr(1),parents);   
  368.                 }else if(selector.indexOf('.')==0) {   
  369.                     return getClassName(selector.substr(1),'',parents);   
  370.                 }else{   
  371.                     return getTagName(selector,parents);   
  372.                 }   
  373.             }else if(parents.length>0) {   
  374.                 for(var i in parents) {   
  375.                     var allChilds = findAllChild(parents[i]);   
  376.                     for(var j in allChilds) {   
  377.                         if(selector.indexOf('#')==0) {   
  378.                             if(allChilds[j].id==selector.substr(1)) {   
  379.                                 elems.push(allChilds[j]);   
  380.                             }   
  381.                         }else if(selector.indexOf('.')==0) {       
  382.                             if(allChilds[j].className==selector.substr(1)) {   
  383.                                 elems.push(allChilds[j]);   
  384.                             }   
  385.                         }else{   
  386.                             if(allChilds[j].nodeName.toLowerCase()==selector) {   
  387.                                 elems.push(allChilds[j]);   
  388.                             }   
  389.                         }   
  390.                     }   
  391.                 }                              
  392.                 return elems;   
  393.             }   
  394.         }   
  395.         var findAllChild = function(node) {   
  396.             var childs=[];   
  397.             if(node.childNodes.length>0) {   
  398.                 childs = getTagName('*',node);   
  399.             }   
  400.             return childs;   
  401.         }   
  402.         var getId = function(id,node) {   
  403.             var elems=[];   
  404.             if(node.length==undefined) {   
  405.                 elems.push(document.getElementById(id));   
  406.             }else{   
  407.                 for(var i in node) {   
  408.                     var allChilds = findAllChild(node[i]);   
  409.                     for(var j in allChilds) {   
  410.                         if(allChilds[j].id==id) {   
  411.                             elems.push(allChilds[j]);   
  412.                         }   
  413.                     }   
  414.                 }   
  415.             }   
  416.             return elems;   
  417.         }   
  418.         //Object=C.getTagName(tagname[,node]);   
  419.         var getTagName = function(tagName,node) {   
  420.             var tagName = tagName || '*',node = node || document,elems=o=[];   
  421.             o = node.getElementsByTagName(tagName);   
  422.             for(var i in o) {   
  423.                 if(o[i].nodeType==1) {   
  424.                     elems.push(o[i]);   
  425.                 }   
  426.             }   
  427.             return elems;   
  428.         }   
  429.         //Object=C.getClassName(className[,tagName[,node]]);   
  430.         var getClassName = function(className,tagName,node) {   
  431.             var elems = [],className = className||'',tagName = tagName||'*',node = node||document,o = getTagName(tagName,node),i;   
  432.             for(i=0;i<o.length;i++) {   
  433.                 if(className == o[i].className) {   
  434.                     elems.push(o[i]);   
  435.                 }   
  436.             }   
  437.             return elems;   
  438.         }   
  439.         var bind = function(ele,type,fn) {   
  440.             //兼容Mozilla系列   
  441.             if(ele.addEventListener) {   
  442.                 ele.addEventListener(type,fn,false);       
  443.               //兼容IE   
  444.             }else if(ele.attachEvent) {   
  445.                 ele.attachEvent('on'+type,fn);   
  446.             }    
  447.         }   
  448.         var unbind = function(ele,type,fn) {   
  449.             //兼容Mozilla系列   
  450.             if(ele.removeEventListener) {   
  451.                 ele.removeEventListener(type,fn,false);    
  452.               //兼容IE   
  453.             }else if(ele.detachEvent) {   
  454.                 ele.detachEvent('on'+type,fn);   
  455.             }   
  456.         }   
  457.         var getStyle = function(ele,name) {   
  458.             //兼容IE   
  459.             if (ele.currentStyle) {      
  460.                 return ele.currentStyle[name];      
  461.             //兼容Mozilla系列   
  462.             } else if (window.getComputedStyle) {      
  463.                 name = name.replace(/([A-Z])/g, "-$1").toLowerCase();      
  464.                 //获取style对象并取得属性的值(如果存在的话)   
  465.                 return window.getComputedStyle(ele, null).getPropertyValue(name);      
  466.             } else {      
  467.                 return null;      
  468.             }      
  469.         }   
  470.         var before = function(ele,node) {   
  471.             var parent = ele.parentNode;   
  472.             parent.insertBefore(node,ele);   
  473.         }   
  474.         var after = function(ele,node) {   
  475.             var parent = ele.parentNode;   
  476.             if(getLastChild(parent)==ele) {   
  477.                 parent.appendChild(node);   
  478.             }else {   
  479.                 parent.insertBefore(node,getNextSibling(ele));   
  480.             }   
  481.         }   
  482.         var getNextSibling = function(ele) {   
  483.             if(ele.nextSibling.nodeType==1) {   
  484.                 return ele.nextSibling;   
  485.             }else if(ele.nextSibling.nodeType==3) {   
  486.                 return ele.nextSibling.nextSibling;   
  487.             }   
  488.         }   
  489.         var getLastChild = function(ele) {   
  490.             if(ele.lastChild.nodeType==1) {   
  491.                 return ele.lastChild;   //IE   
  492.             }else if(ele.lastChild.nodeType==3) {   
  493.                 return ele.lastChild.previousSibling;   //兼容firefox   
  494.             }else {   
  495.                 return null;   
  496.             }   
  497.         }   
  498.         var buildFragment = function(node) {   
  499.             var fragment = document.createDocumentFragment();   
  500.             for(var i in node){   
  501.                 while (node.length>fragment.childNodes.length) {   
  502.                     for(var i in node) {   
  503.                         if(node[i]!=undefined && node[i].nodeType==1){   
  504.                             //将node先保存到片段 documentFragment    
  505.                             fragment.appendChild(node[i]);   
  506.                         }   
  507.                     }   
  508.                 }   
  509.             };   
  510.             return fragment;   
  511.         }   
  512.     }//end function CC   
  513.     window.C = new CC();   
  514. })();   
评论:
发表评论:
姓名：
联系方法:(选填)
评论内容:
个人信息
迎接
昵称:C7_yaohuaq
QQ:88523499
Email:c77cc#vip.qq.com
居住地:北京 海淀
星座:天蝎
毕业院校:广西民族大学
工作点:喜讯无限