the code is as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script> /* File Created: March 13, 2013 */ var jSearch = function (selector, context) { if (window == this) { return new jSearch(selector, context); } selector = selector || document; if (typeof selector == "string") { return new jSearch(context).find(selector); } return this.setArray((selector.constructor == Array && selector) || [selector]); } jSearch.fn = jSearch.prototype = { version: 1.0, length: 0, pushStack: function (a) { var ret = new jSearch(a); return ret; }, setArray: function (a) { this.length = 0; [ ].push.apply(this, a); return this; }, find: function (t) { return this.pushStack(jSearch.find(t)); }, val: function () { console.log("this is val method just for demonstration"); }, text: function () { console.log("this is text method just for demonstration"); } } jSearch.extend = jSearch.fn.extend = function () { var target = arguments[0], a = 1; if (arguments.length == 1) { target = this; a = 0; } var prop; while (prop = arguments[a++]) { for (var i in prop) target[i] = prop[i]; } return target; } jSearch.extend({ //This is a genuine method to retrieve html object. //If t starts with #,just call native getElementById method,etc. find: function (t, context) { if (t.indexOf("#") == 0) { var id = t.substring(1, t.length); return document.getElementById(id); } if (t.indexOf(".") == 0) { return getElementsByClassName(t.substring(1, t.length)); } else { alert("don't support the selector"); } }, filter: function () { console.log("this is text filter just for demonstration"); }, each: function (obj, fn) { for (var i = 0, ol = obj.length; i < ol; i++) { fn.apply(obj[i]) } } }); jSearch.event = { add: function (element, type, handler) { element["on" + type] = handler; } } jSearch.fn.extend({ each: function (fn) { jSearch.each(this, fn); }, bind: function (type, fn) { return this.each(function () { jSearch.event.add(this, type, fn); }); } }) function getElementsByClassName(className) { var all = document.all ? document.all : document.getElementsByTagName('*'); var elements = new Array(); for (var e = 0; e < all.length; e++) { if (all[e].className == className) { elements[elements.length] = all[e]; } } return elements } </script> <script type="text/javascript"> window.onload = function(){ var elem = jSearch(".cjy"); elem.bind("click",test1111); }; function test1111(){ alert(1111); } </script> </head> <body> <button id="btnSave" class="cjy" role="approve" >btnSave</button> <button id="Button1" class="cjy" role="approve" >Button1</button> <button id="Button2" role="approve" >Button2</button> </body> </html>