1 /*
2 * 作者： 胡乐
3 * 2015/4/18
4 * js 基础 和 工具库
5 *
6 *
7 * */
8 //根据获取对象
9 function hGetId(id){
10 return document.getElementById(id);
11 }
12 //获取标签
13 function hGetTagName(el , parentObj){
14 return parentObj?parentObj.getElementsByTagName(el):document.getElementsByTagName(el);
15 }
16 //获取class
17 function hGetClass(paremtObj,tagName,className){
18
19 var aEl = obj.getElementsByTagName(tagName);
20 var arr = [];
21 var arrClassName = [];
22
23 for (var i = 0; i < aEl.length; i++) {
24 arrClassName = aEl[i].className.split(' ');
25 for (var j = 0; j < arr2.length; j++) {
26 if(arrClassName[j] === className){
27 arr.push(aEl[i]);
28 break;
29 }
30 }
31 }
32
33 return arr;
34 }
35 //查找数组是否存在某一个值
36 function arrIndexOf(arr , v){
37 for (var i = 0; i < arr.length; i++) {
38 if(arr[i] == v){
39 return i;
40 }
41 }
42 return -1;
43 }
44 //添加class
45 function addClass(obj,className){
46 if(obj.className == ''){
47 obj.className = className;
48 }else{
49 var arrClassName = obj.className.split(' ');
50 var _index = arrIndexOf(arrClassName , className);
51 if(_index == -1){
52 obj.className += ' '+className;
53 }
54 }
55 }
56 //移除class
57 function removeClass(obj,className){
58 if(obj.className != ''){
59 var arrClassName = obj.className.split(' ');
60 var _index = arrIndexOf(arrClassName, className);
61 if(_index != -1){
62 arrClassName.split(_index,1);
63 obj.className = arrClassName.join(' ');
64 }
65 }
66 }
67 //获取对象样式
68 function hGetStyle(obj , attr){
69 return obj.currentStyle?obj.currentStyle[attr] : getComputedStyle( obj ,null )[attr];
70 }
71
72 //移动函数
73 function hDoMove(obj , attr ,s ,target , endFn ){
74 // 获取当前对象的的位置
75 var pos = parseInt(hGetStyle(obj,attr));
76 //如果目标点的位置 大于当前距离，那么 就是正向移动，否则就是负向移动
77 s = target > pos ? s : -s;
78 //清除上一个定时器
79 clearInterval(obj.hDoMovetimer);
80 //创建新的定时器
81 obj.hDoMovetimer = setInterval(function(){
82 //距离等于 当前对象的实时距离 + 每次要移动的距离
83 var distance = parseInt(hGetStyle(obj,attr)) + s ;
84 // 如果 上一步计算的距离大于 给定的目标点距离， 进行修正 = 目标距离
85 if( distance > target && s > 0 || distance < target && s < 0){
86 distance = target;
87 }
88 // 对象移动
89 obj.style[attr] = distance + 'px';
90 // 如果距离 已经到达目标点， 清除定时器，执行回调函数
91 if( distance === target){
92 clearInterval(obj.hDoMovetimer);
93 // 回调函数是否是未定义？ 不是则执行
94 endFn && endFn();
95 }
96 },20)
97 }
98 //抖动函数
99 function hShake ( obj, attr, endFn ) {
100 /*
101 * 两种办法解决抖动函数隐患的问题：
102 * 1. 进入函数先 进到一个if控制，永远不直接执行抖动函数的主体代码 ， 而是取当前 对象的位置和 50毫秒后的位置 ， 比较是否相等， 如果相等，
103 * 则 说明对象当前抖动已经结束， 可以执行抖动效果！（有稍微的一点小BUG）
104 * 2. 如果用一个变量开关来控制，也是挺好的， 但是， 变量开关不能函数开始被初始化也不能在函数结束后被清除。。 否则，每次触发这函数都可以
105 * 顺利的往下执行抖动函数的主体代码，那就不能修复问题。 需要一个变量，他能存在的时间更长， 将变量挂在 window 的身上的时候 （win
106 * dow.flag = false），每次就只能触发一次 对象进行抖动，下一个需要等到上一个抖动的对象抖动结束后，才能抖动， 这种效果，并不是想要
107 * 的，所以 ， 将开关挂在 传递进来的 obj身上 是最好的选择， 每个对象身上的开关管理 各自身上的 抖动问题处理，而且obj.flag在函数执行结束后
108 * 并没有被回收，因为，他是从函数外部传递进来的，生命期很长！！ 这样再次触发函数的时候，obj.flag = true，这个条件成立 if(obj.flag)
109 * {return} ，不往下执行了。。。除非抖动结束后， num === 数组的最后一个值， 这时候才 赋值 为 false.
110 * */
111 if(obj.flag) {return} ; //初始化 未定义（false 不执行 return)，
112 obj.flag = true; // 马上赋值 true， 这样再次触发 函数 上一个判断就为 真（obj.flag 是传递进来的对象的属性，而对象是从外部传进来的，所以 没有被回收）， 直接返回 ，不执行以下代码。
113
114 var pos = parseInt( hGetStyle(obj, attr)); // 刚开始对象的位置
115
116 //抖动函数运动轨迹数组
117 var arr = []; // 20, -20, 18, -18 ..... 0
118 var num = 0;
119 var timer = null;
120 //自动生成一个运动轨迹的数组
121 for ( var i=20; i>0; i-=2 ) {
122 arr.push( i, -i );
123 }
124 arr.push(0);
125 //先清除定时器
126 clearInterval( obj.shake );
127
128 obj.shake = setInterval(function (){
129 obj.style[attr] = pos + arr[num] + 'px';
130 num++;
131 //如果已经运动到最后一个值，清除定时器，执行回调函数
132 if ( num === arr.length ) {
133 clearInterval( obj.shake );
134 endFn && endFn();
135 obj.flag = false; //抖动结束后， 赋值false， 再次触发这个函数，会执行顶部的判断,就能再次抖动拉
136 }
137 }, 50);
138 }
139
140
141 /*
142 读取或者设置el元素的透明值，val取值为0-1
143 */
144 function hOpacity(el,val) {
145 var f=el.filters,s=el.style;
146 if (arguments.length==1)
147 return f?(f.alpha?(f.alpha.opacity/100):1):(s.opacity||1);
148 s.zoom=1;
149 s.filter="alpha(opacity="+parseInt(val*100)+")";
150 s.opacity=val;
151 };
152
153 //透明度淡出函数
154 function hFadeOut(obj , time ,endFn){
155 obj.iNum = 0;
156 clearInterval(obj.hFadeTimer);
157 obj.hFadeTimer = setInterval(function(){
158 obj.iNum++;
159 //使用设置和读取透明度函数
160 hOpacity(obj,hOpacity(obj)-0.1);
161 //处理有些浏览器透明度不能到零的问题。
162 if(obj.iNum >= 10){
163 obj.style.opacity = 0;
164 obj.iNum = 0;
165 }
166 if(hGetStyle(obj, 'opacity') == 0){
167 clearInterval(obj.hFadeTimer);
168 endFn && endFn();
169 }
170 },time)
171 }
172
173
174 //获取当前并设置详细年月日期,设置第二个参数来确定获得的年月日详细情况
175 function hgetTime(iNum){
176 var hTime ={};
177
178 var myTime = new Date();
179
180 var iYear = myTime.getFullYear();
181 var iMonth = myTime.getMonth()+1;
182 var iDate = myTime.getDate();
183 var iWeek = myTime.getDay();
184 var iHours = myTime.getHours();
185 var iMin = myTime.getMinutes();
186 var iSec = myTime.getSeconds();
187
188 if( iWeek === 0 ) iWeek = '星期日';
189 if( iWeek === 1 ) iWeek = '星期一';
190 if( iWeek === 2 ) iWeek = '星期二';
191 if( iWeek === 3 ) iWeek = '星期三';
192 if( iWeek === 4 ) iWeek = '星期四';
193 if( iWeek === 5 ) iWeek = '星期五';
194 if( iWeek === 6 ) iWeek = '星期六';
195
196 //默认显示所有的年月日星期等详细的信息
197 if(iNum === 0 || typeof(iNum) == 'undefined'){
198 hTime.str = iYear+ '年' +iMonth+'月'+iDate+'日 '+iWeek+' '+ toTwo(iHours)+' : '+ toTwo(iMin)+' : '+ toTwo(iSec);
199 }else if(iNum === 1){
200 hTime.str = toTwo(iHours)+' : '+ toTwo(iMin)+' : '+ toTwo(iSec);
201 }else if(iNum === 2){
202 hTime.str = toTwo(iHours)+toTwo(iMin)+toTwo(iSec);
203 }
204
205 function toTwo ( n ) {
206 return n < 10 ? '0' + n : '' + n;
207 }
208 //时间戳
209 hTime.getTime = Math.floor( myTime.getTime()/1000 );
210 hTime.Hours = iHours;
211 hTime.Min = iMin;
212 hTime.Sec = iSec;
213 return hTime;
214 }
215
216 //倒计时函数 NewTime 为倒计时截止时间 格式为： 'November 27,2015 22:3:0'
217 function hCountDown(obj ,NewTime , endFn){
218 /*
219 * 月份取值：January、February、March、April、May、June、July、August、September、October、November、December
220 * 时间转换公式:
221 * 天：Math.floor(t/86400)
222 * 时：Math.floor(t%86400/3600)
223 * 分：Math.floor(t%86400%3600/60)
224 * 秒：t%60
225 * 获取时间对象：new Date()
226 - getFullYear
227 - getMonth
228 - getDate
229 - getDay
230 - getHours
231 - getMinutes
232 - getSeconds
233 - 时间戳：new Date().getTime()-返回从1970年1月1日到现在的毫秒数（UTC时间标准时间）
234 * */
235 var iNow = null;
236 var t = 0;
237 var str = '';
238 var timer = null;
239
240 iNew = new Date( NewTime );
241
242 clearInterval( timer );
243
244 timer = setInterval (function (){
245 console.log(NewTime);
246 iNow = new Date();
247 t = Math.floor( ( iNew - iNow ) / 1000 );
248 if ( t >= 0 ) {
249 str = Math.floor(t/86400)+'天'+Math.floor(t%86400/3600)+'时'+Math.floor(t%86400%3600/60)+'分'+t%60+'秒';
250 obj.innerHTML = str;
251 } else {
252 clearInterval( timer );
253 endFn && endFn();
254 }
255
256 }, 1000);
257 }
258
259 //检查是否是数字
260 //charCodeAt() 方法可返回指定位置的字符的 Unicode 编码。这个返回值是 0 - 65535 之间的整数。
261 function hDetectNum(val){
262 var str = '';
263 for (var i = 0; i < val.length; i++) {
264 str = val.charCodeAt(i);
265 if(str < 47 || str > 57){
266 return false;
267 }
268 }
269 return true;
270 }
271
272 function hShow(obj){
273 obj.style.display = 'block';
274 }
275 function hHide(obj){
276 obj.style.display = 'none';
277 }
278 //查找和替换函数 iNum = 1 时候为替换模式，val2 为'' 的时候为删除 val1 中的内容。
279 function hReplace(str , val1 , val2 , iNum){
280 var hReplace = {};
281 hReplace.flag = true;
282 hReplace.newStr = '';
283
284 function strIndexOf(){
285 if(str.indexOf(val1) === -1){
286 hReplace.flag = false;
287 return hReplace;
288 }
289 }
290 if(typeof(val2) === 'undefined'){
291 strIndexOf();
292 hReplace.newStr = str.split(val1).join('<span style="background:yellow;">'+ val1 +'</span>');
293 }else if(iNum === 1){
294 strIndexOf();
295 hReplace.newStr = str.split(val1).join('<span style="background:yellow;">'+ val2 +'</span>');
296 }
297
298 return hReplace;
299 }
300
301 //获取元素距离浏览器的距离
302 function hGetPos(obj){
303 var pos = {left:0,top:0};
304 while (obj){
305 pos.left += obj.offsetLeft;
306 pos.top += obj.offsetTop;
307 obj = obj.offsetParent;
308 }
309 return pos;
310 }
