1 function getStyle(obj,attr){
2 if(obj.currentStyle){
3 return obj.currentStyle[attr];
4 }
5 else{
6 return getComputedStyle(obj,false)[attr];
7 }
8 }
9
10 function getByClass(oParent,sClass){
11 var arr = [];
12 var aEle = oParent.getElementsByTagName("*");
13 for(var i = 0;i < aEle.length;i ++){
14 if(aEle[i].className == sClass){
15 arr.push(aEle[i])
16 }
17 }
18 return arr;
19 }
20
21 function myAddEvent(obj,sEv,fn){
22 //改造后return false 能同时具有阻止冒泡和默认事件的作用
23 if(obj.attachEvent){
24 obj.attachEvent("on"+sEv,function(){
25 if(false == fn.call(obj)){
26 event.cancelBubble = true;
27 return false;
28 }
29 });
30 }
31 else{
32 obj.addEventListener(sEv,function(ev){
33 if(false == fn.call(obj)){
34 ev.cancelBubble = true;
35 ev.preventDefault();
36 }
37 },false);
38 }
39 }
40
41 function jQuery(vArg){
42 this.elements = [];
43 switch(typeof vArg){//typeof
44 case "function":
45 myAddEvent(window,"load",vArg);
46 break;
47 case "string":
48 switch(vArg.charAt(0)){
49 case "#":
50 var obj = document.getElementById(vArg.substring(1));
51 this.elements.push(obj);
52 break;
53 case ".":
54 this.elements = getByClass(document,vArg.substring(1));
55 break;
56 default:
57 this.elements = document.getElementsByTagName(vArg);
58 }
59 break;
60 case "object":
61 this.elements.push(vArg);
62 }
63 }
64
65 function $(vArg){
66 return new jQuery(vArg);
67 }
68
69
70 jQuery.prototype.click = function(fn){
71 for(var i = 0;i < this.elements.length;i ++){
72 myAddEvent(this.elements[i],‘click‘,fn);
73 }
74 return this;//支持链式操作
75 };
76
77 jQuery.prototype.css = function(attr,value){
78 if(arguments.length == 2){
79 for(var i = 0;i < this.elements.length;i ++){
80 this.elements[i].style[attr] = value;
81 }
82 }
83 else{
84 if(typeof attr == "string"){//typeof
85 return getStyle(this.elements[0],attr);//获取时不能链式操作，因为到这里就返回了。带单位
86 }
87 else{
88 for(var i = 0;i < this.elements.length;i ++){
89 var k = "";
90 for(k in attr){
91 this.elements[i].style[k] = attr[k];
92 }
93 }
94 }
95 }
96 return this;
97 };
98 //0 >> fn1
99 //1 >> fn2
100 //3 >> fn3
101 jQuery.prototype.toggle = function(){
102 var _arguments = arguments;
103 for(var i = 0;i < this.elements.length;i ++){
104 addToggle(this.elements[i]);
105 }
106 function addToggle(obj){
107 var count = 0;
108 myAddEvent(obj,"click",function(){
109 _arguments[count++ % _arguments.length].call(obj);
110 });
111 }
112 return this;
113 };
114
115 jQuery.prototype.attr = function(name,value){
116 if(arguments.length == 2){
117 for(var i = 0;i < this.elements.length;i ++){
118 this.elements[i][name] = value;
119 }
120 }
121 else{
122 return this.elements[0][name];
123 }
124 return this;
125 };
126
127 jQuery.prototype.eq = function(num){
128 return $(this.elements[num]);//普通的dom对象变成jQuery对象。单一dom对象的处理方式
129 };
130
131 jQuery.prototype.find = function(str){
132 var aResult = [];
133 for(var i = 0;i < this.elements.length;i ++){
134 switch(str.charAt(0)){
135 case ".":
136 var aEle = getByClass(this.elements[i],str.substring(1));
137 aResult = aResult.concat(aEle);
138 default:
139 var aEle = this.elements[i].getElementsByTagName(str);
140 appendArr(aResult,aEle);
141 }
142 }
143 var newJquery = $();
144 newJquery.elements = aResult;//数组dom对象的处理方式
145 return newJquery;
146 };
147
148 function appendArr(arr1,arr2){
149 for(var i = 0;i < arr2.length;i ++){
150 arr1.push(arr2[i]);
151 }
152 }
153
154 jQuery.prototype.index = function(){
155 return getIndex(this.elements[0]);
156 };
157
158 function getIndex(obj){
159 var aBrother = obj.parentNode.children;
160 for(var i = 0;i < aBrother.length;i ++){
161 if(aBrother[i] == obj){
162 return i;
163 }
164 }
165 }
166
167 jQuery.prototype.bind = function(sEv,fn){
168 for(var i = 0;i < this.elements.length; i++){
169 myAddEvent(this.elements[i],sEv,fn);
170 }
171 };
172
173 //extend
174 jQuery.prototype.extend = function(name,fn){
175 jQuery.prototype[name] = fn;
176 };
177
178 $().extend("size",function(){
179 return this.elements.length;
180 });
181
182 $().extend("animate",function(json){
183 for(var i = 0;i < this.elements.length;i ++){
184 startMove(this.elements[i],json);
185 }
186 function startMove(obj,json,fnEnd){
187 clearInterval(obj.timer);
188 obj.timer = setInterval(function(){
189 var oStop = true;
190 for( var attr in json){
191 var cur = 0;
192 if(attr == "opacity"){
193 cur = Math.round( parseFloat( getStyle(obj,attr) ) * 100 );
194 }
195 else{
196 cur = parseInt( getStyle(obj,attr) );
197 }
198
199 var speed = (json[attr] - cur) / 7;
200 speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
201
202 if(cur != json[attr]){
203 oStop = false;
204 }
205 if(attr == "opacity"){
206 obj.style.filter = ‘alpha(opacity:‘+(cur+speed)+‘)‘;
207 obj.style.opacity = (cur + speed) / 100;
208 }
209 else{
210 obj.style[attr] = cur + speed + "px";
211 }
212 }
213 if(oStop){
214 clearInterval(obj.timer);
215 fnEnd&&fnEnd();
216 }
217 },30);
218 }
219 });
220
221 $().extend(‘drag‘,function(){
222 for(var i = 0;i < this.elements.length;i++){
223 drag(this.elements[i]);
224 }
225 function drag(obj){
226 var disX = 0;
227 var disY = 0;
228 obj.onmousedown = function(ev){
229 //这里位置的计算一定是mousedown的时候
230 var oEvent = ev || event;
231 disX = oEvent.clientX - parseInt( getStyle(obj,"left") );
232 disY = oEvent.clientY - parseInt( getStyle(obj,"top") );
233
234 if(obj.setCapture){
235 obj.onmousemove = mouseMove;
236 obj.onmouseup = mouseUp;
237 obj.setCapture();
238 }
239 else{
240 document.onmousemove = mouseMove;
241 document.onmouseup = mouseUp;
242 }
243 function mouseMove(ev){
244 var oEvent = ev || event;
245
246 obj.style.top = oEvent.clientY - disY + "px";
247 obj.style.left = oEvent.clientX - disX + "px";
248 }
249 function mouseUp(){
250 this.onmousemove = this.onmouseup = null;
251 if(obj.releaseCapture){
252 obj.releaseCapture();
253 }
254 }
255 return false;
256 };
257 }
258 });
时间： 2024-10-31 11:56:53