常用函数封装整理
来源:互联网 发布:淘宝联盟提现时间 编辑:程序博客网 时间:2024/06/05 16:22
阻止对象默认行为
//preDef(Event对象)function preDef(ev){ var ev = ev || window.event; if(ev.preventDefault){ ev.preventDefault(); }else { ev.returnValue = false; }}
获取触发事件目标
//getTarget(Event对象)function getTarget(ev){ var ev = ev || window.event; if(ev.target){ return ev.target; }else if(window.event.srcElement){ return window.event.srcElement; }}
获取滚动条位置
//获取滚动条的位置,即滚动距离,返回的结果是一个对象function getSP(){ return { top : document.documentElement.scrollTop || document.body.scrollTop, left : document.documentElement.scrollLeft || document.body.scrollLeft }}
获取可视化窗口大小
function getWindow() { if(window.innerWidth !== void 0) { return { width: window.innerWidth, height: window.innerHeight } } else { return { width: document.documentElement.clientWidth, height: document.documentElement.clientHeight } }}
获取屏幕坐标
//获取鼠标的位置信息,该位置为鼠标在整个页面的位置,而不是可视化窗口的位置function getMouse(ev) { if(ev.pageX !== void 0) { return { x: ev.pageX, y: ev.pageY }; } return { x: ev.clientX + document.body.scrollLeft - document.body.clientLeft, y: ev.clientY + document.body.scrollTop - document.body.clientTop }}
js拖拽效果(目标相对定位)
//实现JS的拖拽效果,利用相对定位实现 onDrop(dom节点)function onDrop(ele) { if(ele.nodeType === 1) { ele.style.position = "relative"; ele.onmousedown = function(ev) { var ev = ev || window.event; var diffX = ev.clientX - parseInt(ele.style.left + "0"), diffY = ev.clientY - parseInt(ele.style.top + "0"); document.onmousemove = function(e) { var e = e || window.event; ele.style.left = e.clientX - diffX + "px"; ele.style.top = e.clientY - diffY + "px"; }; document.onmouseup = function(e) { var e = e || window.event; this.onmousemove = null; this.onmouseup = null; }; } }}
判断类型
//判断数据类型,返回首字母大写的字符串function getType(ob){ return ({}).toString.call(ob).match(/(\w+)]$/)[1];}
数组去重
//返回没有重复值的新数组(多个NaN也视为重复)//ES6最简 [...new Set([1,2,3,1,2,1,4])]//ES5最简 [1,2,3,1,4,1,2,1].filter(function(e,i,arr){return i===arr.indexOf(e)})function unique(arr) { var a = [], hasNaN = false; for(var i = 0; i < arr.length; i++) { if(a.indexOf(arr[i]) == -1) { if(arr[i] !== arr[i]) { if(hasNaN) { continue; } hasNaN = true; } a.push(arr[i]); } } return a;}
深度克隆
//实现深度克隆对象function clone(ob) { if(typeof ob === "object") { var newOb = ({}).toString.call(ob) === "[object Array]" ? [] : {}; for(var name in ob) { newOb[name] = typeof ob[name] === "object" ? clone(ob[name]) : ob[name]; } return newOb; } else { return ob; }}
获取时间
//返回格式化后的时间,str为格式化样式,默认为(yyyy-MM-dd HH:mm:ss),date为时间对象,默认为当前时间function getTime(str,date){ var str = str || "yyyy-MM-dd HH:mm:ss"; var date = date || new Date(); var obj = { yyyy:date.getFullYear(), yy:(""+ date.getFullYear()).slice(-2), M:date.getMonth()+1, MM:("0"+ (date.getMonth()+1)).slice(-2), d:date.getDate(), dd:("0" + date.getDate()).slice(-2), H:date.getHours(), HH:("0" + date.getHours()).slice(-2), h:date.getHours() % 12, hh:("0"+date.getHours() % 12).slice(-2), m:date.getMinutes(), mm:("0" + date.getMinutes()).slice(-2), s:date.getSeconds(), ss:("0" + date.getSeconds()).slice(-2), w:"星期"+['日', '一', '二', '三', '四', '五', '六'][date.getDay()] }; return str.replace(/([a-z]+)/ig,function($1){return obj[$1]});}
随机产生颜色
//产生16进制的颜色值function getColor(){ return "#"+Math.random().toString(16).substr(2,6);}
天数跟秒转换
//天数跟秒之间的转换,适用于倒计时,秒杀..//例如"1天12小时12分32秒"<==>130352之间相互转换function changeTime(t) { if(typeof t === "string") { var num = 0; t.replace(/(\d+)(天|小时|分|秒)/g, function(a, b, c) { switch(c) { case "天": num += (+b) * 86400; break; case "小时": num += (+b) * 3600; break; case "分": num += (+b) * 60; break; case "秒": num += (+b); break; } }); return num; } else if(typeof t === "number") { var time = "", ob = { "天": 86400, "小时": 3600, "分": 60, "秒": 1 }; if(t < 0) return "0秒"; for(var name in ob) { var num = ob[name]; if(t >= num) { time += (t / num | 0) + name; t %= num; } } return time; }}
JS千分隔位
//每3位数加个逗号,保留两位小数//123456.454==>123,456.45function separator(str){ if(!isNaN(+str)){ str = (+str).toFixed(2); return str.replace(/\B(?=(?:\d{3})+\.)/g,","); }}
获取计算后样式
//获取某个节点计算后样式,参数为dom节点,属性名称function getCpStyle(ele,attribute){ if(typeof getComputedStyle === "function"){ return getComputedStyle(ele)[attribute]; }else if(ele.currentStyle){ return ele.currentStyle[attribute]; }}
获取XMLHTTPRequest对象
//返回一个XMLHTTPRequest对象function getXHR() { var xhr; if(window.XMLHttpRequest) { xhr = new XMLHttpRequest(); } else if(window.ActiveXObject) { xhr = new ActiveXObject("Microsoft.XMLHttp"); } return xhr;}
类名操作
//类似jq的toggleClass,没有就添加,有就删除function setClass(ele, className) { if(ele.className !== void 0) { var str = ele.className, reg = new RegExp("\\b" + className + "\\s"); if(reg.test(str)) { str = str.replace(reg, ""); } else { str += " " + className + " "; } ele.className = str.replace(/\s+/, " "); }}
cookie操作
var docCookies = { getItem: function(sKey) { return decodeURIComponent(document.cookie.replace(new RegExp("(?:(?:^|.*;)\\s*" + encodeURIComponent(sKey).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=\\s*([^;]*).*$)|^.*$"), "$1")) || null; }, setItem: function(sKey, sValue, vEnd, sPath, sDomain, bSecure) { if(!sKey || /^(?:expires|max-age|path|domain|secure)$/i.test(sKey)) { return false; } var sExpires = ""; if(vEnd) { switch(vEnd.constructor) { case Number: sExpires = vEnd === Infinity ? "; expires=Fri, 31 Dec 9999 23:59:59 GMT" : "; max-age=" + vEnd; break; case String: sExpires = "; expires=" + vEnd; break; case Date: sExpires = "; expires=" + vEnd.toUTCString(); break; } } document.cookie = encodeURIComponent(sKey) + "=" + encodeURIComponent(sValue) + sExpires + (sDomain ? "; domain=" + sDomain : "") + (sPath ? "; path=" + sPath : "") + (bSecure ? "; secure" : ""); return true; }, removeItem: function(sKey, sPath, sDomain) { if(!sKey || !this.hasItem(sKey)) { return false; } document.cookie = encodeURIComponent(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT" + (sDomain ? "; domain=" + sDomain : "") + (sPath ? "; path=" + sPath : ""); return true; }, hasItem: function(sKey) { return(new RegExp("(?:^|;\\s*)" + encodeURIComponent(sKey).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=")).test(document.cookie); }};
Ajax对象封装
var Ajax = { get: function(url, fn) { var obj = new XMLHttpRequest(); obj.open('GET', url, true); obj.onreadystatechange = function() { if(obj.readyState == 4 && obj.status == 200 || obj.status == 304) { fn.call(this, obj.responseText); } }; obj.send(); }, post: function(url, data, fn) { var obj = new XMLHttpRequest(); obj.open("POST", url, true); obj.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); obj.onreadystatechange = function() { if(obj.readyState == 4 && (obj.status == 200 || obj.status == 304)) { fn.call(this, obj.responseText); } }; obj.send(data); }}
阅读全文
0 0
- 常用函数封装整理
- 常用函数封装整理
- PHP常用函数封装整理
- API常用函数封装
- Selenium常用函数封装
- javascript 常用函数封装
- 常用JavaScript函数封装
- js常用函数封装
- 常用函数的封装
- ASP常用函数整理
- Oracle常用函数整理
- Oracle常用函数整理
- 常用函数整理
- MFC常用函数整理
- JS 常用函数整理
- javascript 常用函数整理
- javascript常用函数整理
- js常用函数整理
- Nginx通过/etc/init.d/nginx方式启动或停止服务
- ipv6禁用
- 【EasyUI】获取所选中行的行标
- 关于eclipse web项目认不到用户库的问题
- 手机侧拉页面布局
- 常用函数封装整理
- 【POJ】2155 Matrix 二维树状数组
- CC2541 新版本IAR 编译link问题
- input file控件限制上传文件类型 网页上添加一个input file HTML控件: 1 <input id="File1" type="file" /> 默认是这样的,所有文件类
- David Silver强化学习课程笔记(三)
- windows下安装rabbitmq的步骤详解
- Webstorm填坑系列
- 【java基础】多态的解读及用法!
- IRIS Readiris Corporate 16.0.2.10288 1CD