号称史上最小的javascript的封装库，高效简洁，易用性强，易拓展，大小仅1KB，你没看错，是1KB，不才，由本人原创，提供分享。。。

Question

//$_custom.js
function $_custom(fun)
  {
   document.onreadystatechange = function()
   {           
    if(document.readyState == "complete")
    {
      fun();
    }
   }
  }
function $(val){
if(val.indexOf("#")==0)
{
var obj=document.getElementById(val.substring(1));
custom.call(obj);
return obj;
}
if(val.indexOf(".")==0)
{
var obj=document.getElementsByTagName("*");
for(var x in obj)
{
if(obj[x].className==val.substring(1))
{
custom.call(obj[x]);
return obj[x];
}
}
}
}
//函数自定义处理
var custom=function(){
 this.css=function(param){
 for(var key in param)
 {
  this.style[key]=param[key];
 }
 };
 this.click=function(fun){
     this.onclick=function()
     {      
     fun();          
     }     
 };
 this.blur=function(fun){
     this.onblur=function()
     {      
     fun();          
     }     
 };
 this.focus=function(fun){
     this.onfocus=function()
     {      
     fun();          
     }     
 };
 this.change=function(fun){
     this.onchange=function()
     {      
     fun();          
     }     
 };
 this.mouseover=function(fun){
     this.onmouseover=function()
     {      
     fun();          
     }     
 };
 this.mouseout=function(fun){
     this.onmouseout=function()
     {      
     fun();          
     }     
 };
 //此处省略事件拓展
}使用方法介绍
<script type="text/javascript" src="$_custom.js"></script>
<script type="text/javascript">
$_custom(function(){
$("#sp").css({"width":"250px","height":"250px","border":"1px solid green","background":"#333333"});
$(".sp2").mouseover(function(){
$(".sp2").css({"width":"450px","height":"250px","border":"1px solid green","background":"#333333"});
})
})
<div id="sp">test</div>
<div class="sp2">test</div>

Answer 1

短小精干。不错！添加事件，用
function bindEvent(obj,evt,fun) 
{
     if(window.addEventListener){
           obj.addEventListener(evt, function(e){ fun(e);},false); 
     }else{
           obj.attachEvent('on'+evt,fun);     
    }
};
这样就更好了

Answer 2

不懂了吧，看我的类库有一个什么特点，，就是高仿真jquery，so 一旦达不到项目需求，可以立刻加载jquery，而不必要改动任何javascript语句。。

Answer 3

//纠正1楼的错误，尚未考虑全面，属于垃圾代码，可拓展效率不高。。以下代码为优化版，欢迎项目实战。。 function $_custom(fun)
  {
   document.onreadystatechange = function()
   {           
    if (document.readyState == "complete")
    {
      fun();
    }
   }
  }
function $(val){
if(val.indexOf("#")==0)
{
var ob=new Array();
var obj=document.getElementById(val.substring(1));
ob.push(obj);
custom.call(ob);
return ob;
}
if(val.indexOf(".")==0)
{
var obj=document.getElementsByTagName("*");
var ob=new Array();
for(var x in obj)
{
if(obj[x].className==val.substring(1))
{
obj2=obj[x];
ob.push(obj2);
}
}
custom.call(ob);
return ob;
}
}
var custom=function(){
var actions=["click","blur","focus","mouseout","mouseover","change"];
 this.css=function(param){
 for(var i = 0;i < this.length;i++)
   {
 for(var key in param)
 {
  this[i].style[key]=param[key];
 }
 }
 };
 var _this=this;
(function(){
for(var k in actions){
var _o=actions[k];
      _this[_o]= function(){
      var _oo=_o;
      return function(fun)
      {
      for(var i = 0;i < _this.length;i++)
   {
      _this[i]["on"+_oo]=function()
      {      
      fun();          
           }     
       }
      }
}(_o);
  }
})(actions);
}
向jquery看齐，

Answer 4

差距大是因为不想写了，再写下去就真的变jq了，还不如直接jq，就支持简单选择器样式，常用事件处理

Answer 5

今日拓展版，主要增加了功能如下
1、还原javascript原始写法切换
2、模拟鼠标事件
3、绑定事件，响应上面某一楼的要求
//$_custom.js
function $_custom(fun)
  {
   document.onreadystatechange = function()
   {           
    if (document.readyState == "complete")
    {
      fun();
    }
   }
  }
    function $(val){
        if(val.indexOf("#")==0)
        {
            var ob=new Array();
            var obj=document.getElementById(val.substring(1));            
            ob.push(obj);
            custom.call(ob);
            return ob;
        }
        if(val.indexOf(".")==0)
        {
            var obj=document.getElementsByTagName("*");
            var ob=new Array();
            for(var x in obj)
            {
                if(obj[x].className==val.substring(1))
                {
                    obj2=obj[x];
                    ob.push(obj2);            
                }
            }
            custom.call(ob);        
            return ob;            
        }
    }
var custom=function(){        
    var actions=["click","blur","focus","mouseout","mouseover","change"];
    //样式处理
     this.css=function(param){
         for(var i = 0;i < this.length;i++)
          {
             for(var key in param)
             {
                 this[i].style[key]=param[key];
             }
         }
     };
     var _this=this;
     //函数处理
    (function(){
        for(var k in actions){
            var _o=actions[k];
         _this[_o]= function(){
             var _oo=_o;
             return function(fun)
             {
                 for(var i = 0;i < _this.length;i++)
                  {
                     _this[i]["on"+_oo]=function(event)
                     {             
                            fun(event);                   
                         }        
                     }
             }
        }(_o);
      }
    })(actions);
    //还原javascript基本写法
    this.revert=function(){
     if(_this.length==1)
     {
     return _this[0];
     }
     else
     {
     alert('Does not support!');
     console.log('Does not support!');
     }
    };
    //模拟鼠标事件
    this.similar=function(actions){
     if(document.all) {
_this[0][actions];
}
else {
var e = document.createEvent("MouseEvents");
e.initMouseEvent(actions, true, true);
_this[0].dispatchEvent(e);
}
    };
    //绑定事件
    this.bind=function(actions,fun){
     if(document.all) {
     for(var i = 0;i < _this.length;i++)
     _this[i].attachEvent("on"+actions,function(){fun.call(_this[i])});
     }else{
     for(var i = 0;i < _this.length;i++)
     _this[i].addEventListener(actions,fun);
     }
    }
}使用方法介绍
1.还原写法<script type="text/javascript" src="$_custom.js"></script>
<script type="text/javascript">
$_custom(function(){
$("#sp").revert().style.cssText="width:100px;height:100px;border:1px solid red;";
$("#sp").revert().innerHTML="this is a test...";
</script>
<div id="sp">test</div>2、模拟鼠标事件$("#sp").click(function(){
alert('clicked');
})
$("#sp").similar("click");
//这样刚进入网页即运行点击事件了3、事件绑定 $("#sp").bind("click",function(){
alert('you click');
})
4、获取鼠标位置$("#sp").click(function(){
  alert(event.x);
})
//event参数可直接支持调用，不信试试吧
此贴要火起来，，有什么好功能，欢迎大家来拓展

Answer 6

#3被你直接忽略了,不要用覆盖式的事件分配,使用addEventListener注意dom事件流，指定冒泡式还是捕获式    $('#sp').click(function(){alert(1)})
    $('#sp').click(function(){alert(2)})
这两句看看你的代码，和jquery或者和任何一款成熟框架的运行结果有何区别。

Answer 7

高仿jq？ 看起来只是外观形似。对比之下感觉不如直接用原生的js。

Answer 8

<script type="text/javascript">
$_custom(function(){
$("#sp").click(function(){
alert('you click sp');
});
$("#sp2").click(function(){
alert('you click sp2');
if(document.all)
{
event.cancelBubble = true;
}
else
{
event.stopPropagation();
}
})
})
</script>
<div id="sp" style="width:100px;height:100px;border:1px solid red">
<div id="sp2" style="width:50px;height:50px;border:1px solid red"></div>
</div>对你的说法不以为然，不懂什么分配覆盖之类的这么多大概念，实用才是硬道理，经过实践证明，事件冒泡完全对框架没影响，可以event参数阻止。。还有你说的2个语句，jquery我试过弹出2次1，我的是只有1次弹出2次我不认为是对的，弹出一次说明后面的方法覆盖前面的方法，不知道弹出2次得这种功能用在什么地方。
document.getElementById("sp").onclick=function(){alert(1)};document.getElementById("sp").onclick=function(){alert(1)};
原始的js代码也是后面覆盖前面的。。怀疑jq的正确性了要