• 工作中常用的一些基础方法,记录下


    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).*OSs([d_]+)/),
          ipod = ua.match(/(iPod)(.*OSs([d_]+))?/),
          iphone = !ipad && ua.match(/(iPhonesOS)s([d_]+)/),
          webos = ua.match(/(webOS|hpwOS)[s/]([d.]+)/),
          win = /Wind{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(/(RIMsTabletsOS)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(/MSIEs([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('无图片')
    })
  • 相关阅读:
    vue全家桶
    beego 框架bee安装没有bee.exe解决办法
    beego运行出现错误0004 Failed to build the application: go: github.com/beego/beego/v2@v2.0.1
    10:01:57.727 [main] ERROR o.s.b.SpringApplication [reportFailure,830] Application run failed java.lang.IllegalStateException: Unable to read metadata for class
    idea 设置Run DashBoard窗口
    对象、Map转JSON字符串
    js 获取对象属性值的方法
    js中(...)用法
    JS中find方法的使用
    解决echarts中横坐标值显示不全(自动隐藏)问题
  • 原文地址:https://www.cnblogs.com/pengBoRan/p/8488836.html
Copyright © 2020-2023  润新知