工作中常用的一些基础方法，记录下
1.获取非行间元素的样式
function getstyle（Obj，name）{
if（Obj.currentStyle）{
//ie
return Obj.currentStyle[name];
}
else{
//FF Chrome
return getCompunedStyle(Obj,false)[name];
}
}
调用方式：getstyle（obj，name）
obj：需要获取的元素对象
name：需要获取的样式名
2.数组排序（升序）
var array=[11,22,8,45,89,12]
array.sort(function(n1,n2){
return n1-n2
})
alert(array)
3.zepto封装的滑动方法
handleScrollTo : function () {
$.fn.scrollTo =function(options){
var defaults = {
toT : 0, //滚动目标位置
durTime : 400, //过渡动画时间
delay : 20, //定时器时间
callback:null //回调函数
};
var opts = $.extend(defaults,options),
timer = null,_this = this,
curTop = _this.scrollTop(),//滚动条当前的位置
subTop = opts.toT - curTop, //滚动条目标位置和当前位置的差值
index = 0,dur = Math.round(opts.durTime / opts.delay),
per = Math.round(subTop/dur),
smoothScroll = function(t){
index++;
if(index >= dur){
_this.scrollTop(t);
window.clearInterval(timer);
if(!publicFun.isNull(opts.callback) && typeof opts.callback == 'function') opts.callback();
}else{
_this.scrollTop(curTop + index*per);
}
};
timer = window.setInterval(function(){
smoothScroll(opts.toT);
}, opts.delay);
return _this;
};
},
例 ：回到顶部
handleScrollTo（）
$("body").scrollTo( {toT : 0} );
4.数组的随机排序
var array=[1,22,3,,14,52,8]
function shuffle(arr) {
arr.sort(function () {
return Math.random() - 0.5;
});
}
shuffle(array)
console.log(array)
5.预加载（附Html及js）
html：<div class="loading">
<div class="page">
<div class="h832" style="padding-top: 0px;">
<div class="innerDiv">
<div class="line_c">
<div class="line"></div>
</div>
<p>0% loading...</p>
</div>
</div>
</div>
</div>
var speed=0;
function preloadimages(arr){
var newimages=[], loadedimages=0;
var arr=(typeof arr!="object")? [arr] : arr;
function imageloadpost(){
loadedimages++;
speed=parseInt(loadedimages/arr.length*100);
$('.loading p').text(speed+'% loading...');
$('.line_c .line').css('left',-(100-speed)+'%');
if (loadedimages==arr.length){
$('.loading').hide();
// $('.swiper-wrapper1').show();
}
}
for (var i=0; i<arr.length; i++){
newimages[i]=new Image();
newimages[i].src=arr[i];
newimages[i].onload=function(){
imageloadpost();
}
newimages[i].onerror=function(){
imageloadpost()
}
}
}
var imagesarray=[需要加载的数据资源];
preloadimages(imagesarray);
6.数组去重
function removeDuplicatedItem(arr) { var ret = []; for (var i = 0,i< arr.length; i++) { if (ret.indexOf(arr[i]) === -1) { ret.push(arr[i]); } } return ret; }
7.获取指定范围内的随机数
var getRandom = function(max, min) { min = arguments[1] || 0; return Math.floor(Math.random() * (max - min + 1) + min); };
8.数组去除重复字符
function arry(myArray){ var haha=myArray; for(var i=0;i<myArray.length;i++) { for(var j=0;j<myArray.length;j++) { temp=myArray[i]; if((i+j+1)<myArray.length&&temp==myArray[i+j+1]) //如果当前元素与后一个元素相等 haha.splice(i+j+1,1); //然后就移除下一个元素 } } return haha; }
9.短信发送60秒倒计时
//settime($("#getPhoneCode"),60); function settime($obj, time) { if (time == 0) { $obj.attr("disabled", false); $obj.css("background", "#f38401").css("cursor", "pointer"); $obj.text("获取手机验证码"); return; } else { $obj.attr("disabled", true); $obj.css("background", "#ccc").css("cursor", "not-allowed"); $obj.text("重新发送(" + time + ")"); time--; } setTimeout(function () { settime($obj, time) }, 1000) }
10.去除数组中的最大值和最小值
var numbers = [5, 458 , 120 , -215 , 228 , 400 , 122205, -85411]; var maxInNumbers = Math.max.apply(Math, numbers); var minInNumbers = Math.min.apply(Math, numbers);
11.数组中找一个数
function find (x, y) { for ( let i = 0; i < x.length; i++ ) { if ( x[i] == y ) return i; } return null; } let arr = [0,1,2,3,4,5] console.log(find(arr, 2)) console.log(find(arr, 8))
12.获取随机数的函数方法
var rand = (function() { var today = new Date(); var seed = today.getTime(); function rnd() { seed = (seed * 9301 + 49297) % 233280; return seed / (233280.0); }; return function rand(number) { return Math.ceil(rnd(seed) * number); }; })(); console.log(rand(10))
13.获取浏览器地址栏的参数值
function GetQueryString(name) { var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if(r!=null)return unescape(r[2]); return null; } // 调用方法 alert(GetQueryString("参数名1")); alert(GetQueryString("参数名2")); alert(GetQueryString("参数名3"));
14.关于cookie的使用
（1）设置cookie的公用函数 function setCookie(name , value ,iDay){ var oDay = new Date(); oDay.setDate(oDay.getDate()+iDay) document.cookie = name"="value+";exprice="+oDay } (2)获取cookie的值 function getCookie(name){ var arr = document.cookie.split("; ") for(var i=0;i<arr.length;i++){ var arr2 = arr.split("=") if(arr2[0] == name){ return arr2[1] } } return "" } (3)删除cookie function removeCookie(name){ setCookie(name;1;-1) }
15.常用的 js如何判断当前运行环境
webkit = ua.match(/Web[kK]it[\/]{0,1}([\d.]+)/),
android = ua.match(/(Android);?[\s\/]+([\d.]+)?/),
osx = !!ua.match(/\(Macintosh\; Intel /),
ipad = ua.match(/(iPad).*OS\s([\d_]+)/),
ipod = ua.match(/(iPod)(.*OS\s([\d_]+))?/),
iphone = !ipad && ua.match(/(iPhone\sOS)\s([\d_]+)/),
webos = ua.match(/(webOS|hpwOS)[\s\/]([\d.]+)/),
win = /Win\d{2}|Windows/.test(platform),
wp = ua.match(/Windows Phone ([\d.]+)/),
touchpad = webos && ua.match(/TouchPad/),
kindle = ua.match(/Kindle\/([\d.]+)/),
silk = ua.match(/Silk\/([\d._]+)/),
blackberry = ua.match(/(BlackBerry).*Version\/([\d.]+)/),
bb10 = ua.match(/(BB10).*Version\/([\d.]+)/),
rimtabletos = ua.match(/(RIM\sTablet\sOS)\s([\d.]+)/),
playbook = ua.match(/PlayBook/),
chrome = ua.match(/Chrome\/([\d.]+)/) || ua.match(/CriOS\/([\d.]+)/),
firefox = ua.match(/Firefox\/([\d.]+)/),
firefoxos = ua.match(/\((?:Mobile|Tablet); rv:([\d.]+)\).*Firefox\/[\d.]+/),
ie = ua.match(/MSIE\s([\d.]+)/) || ua.match(/Trident\/[\d](?=[^\?]+).*rv:([0-9.].)/),
webview = !chrome && ua.match(/(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/),
safari = webview || ua.match(/Version\/([\d.]+)([^S](Safari)|[^M]*(Mobile)[^S]*(Safari))/)
校验是否是移动端
if(navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i)){
...
}
16. 判断网页是否加载完成
document.onreadystatechange = function () { if (document.readyState == "complete") { //这里可以写页面加载完成后调用的方法 } }
17.校验图片加载失败处理函数
function preloadImages(arr) { var dfd = new $.Deferred() var newimages = [] var i = 0 var loaded = 0 var loaderr = 0 // 加载失败的图片个数 arr = ($.isArray(arr)) ? arr : [arr] for (; i < arr.length; i++) { newimages[i] = new Image() newimages[i].src = arr[i] newimages[i].onload = function() { loaded++ if (loaded === arr.length) { dfd.resolve() } } newimages[i].onerror = function() { loaded++ loaderr++ // 全部加载失败 if (loaderr === arr.length) { dfd.reject() return } if (loaded === arr.length) { dfd.resolve() } } } return dfd } preloadImages(['1.jpg', '2.jpg']).fail(function() { $('#div').text('无图片') })
