269个JavaScript小函数( 二二二二二二二 )

本是古典何须时尚 2023-02-18 08:06 31阅读 0赞

# 91.返回当前url #

export const currentURL = () => window.location.href;

# 92.获取url参数（第一种） #

/**
    
     * @param {*} name
     * @param {*} origin
       */
    export function getUrlParam(name, origin = null) {
        let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        let r = null;
        if (origin == null) {
            r = window.location.search.substr(1).match(reg);
        } else {
            r = origin.substr(1).match(reg);
        }
        if (r != null) return decodeURIComponent(r[2]);
        return null;
    }

# 93.获取url参数（第二种） #

/**
         * @param {*} name
         * @param {*} origin
           */
           export function getUrlParams(name, origin = null) {
           let url = location.href;
           let temp1 = url.split('?');
           let pram = temp1[1];
           let keyValue = pram.split('&');
           let obj = {};
           for (let i = 0; i < keyValue.length; i++) {
               let item = keyValue[i].split('=');
           let key = item[0];
            let value = item[1];
            obj[key] = value;
        }
        return obj[name];
    
        }

# 94.修改url中的参数 #

/**
         * @param { string } paramName
         * @param { string } replaceWith
           */
           export function replaceParamVal(paramName,replaceWith) {
       var oUrl = location.href.toString();
        var re=eval('/('+ paramName+'=)([^&]*)/gi');
        location.href = oUrl.replace(re,paramName+'='+replaceWith);
        return location.href;
        }

# 95.删除url中指定的参数 #

/**
         * @param { string } name
           */
           export function funcUrlDel(name){
           var loca =location;
           var baseUrl = loca.origin + loca.pathname + "?";
           var query = loca.search.substr(1);
           if (query.indexOf(name)>-1) {
               var obj = {};
               var arr = query.split("&");
               for (var i = 0; i < arr.length; i++) {
                   arr[i] = arr[i].split("=");
                   obj[arr[i][0]] = arr[i][1];
               }
               delete obj[name];
           var url = baseUrl + JSON.stringify(obj).replace(/[\"\{\}]/g,"").replace(/\:/g,"=").replace(/\,/g,"&");
            return url
        }
        }

# 96.获取窗口可视范围的高度 #

export function getClientHeight() {
        let clientHeight = 0;
        if (document.body.clientHeight && document.documentElement.clientHeight) {
            clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight;
        }
        else {
            clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight;
        }
        return clientHeight;
    }

# 97.获取窗口可视范围宽度 #

export function getPageViewWidth() {
        let d = document,
            a = d.compatMode == "BackCompat" ? d.body : d.documentElement;
        return a.clientWidth;
    }

# 98.获取窗口宽度 #

export function getPageWidth() {
        let g = document,
            a = g.body,
            f = g.documentElement,
            d = g.compatMode == "BackCompat" ? a : g.documentElement;
        return Math.max(f.scrollWidth, a.scrollWidth, d.clientWidth);
    }

# 99.获取窗口尺寸 #

export function getViewportOffset() {
        if (window.innerWidth) {
            return {
                w: window.innerWidth,
                h: window.innerHeight
            }
        } else {
            // ie8及其以下
            if (document.compatMode === "BackCompat") {
                // 怪异模式
                return {
                    w: document.body.clientWidth,
                    h: document.body.clientHeight
                }
            } else {
                // 标准模式
                return {
                    w: document.documentElement.clientWidth,
                    h: document.documentElement.clientHeight
                }
            }
        }
    }

# 100.获取滚动条距顶部高度 #

export function getPageScrollTop() {
        let a = document;
        return a.documentElement.scrollTop || a.body.scrollTop;
    }

# 101.获取滚动条距左边的高度 #

export function getPageScrollLeft() {
        let a = document;
        return a.documentElement.scrollLeft || a.body.scrollLeft;
    }

# 102.开启全屏 #

/**
         * @param {*} element
           */
           export function launchFullscreen(element) {
           if (element.requestFullscreen) {
               element.requestFullscreen()
           } else if (element.mozRequestFullScreen) {
               element.mozRequestFullScreen()
           } else if (element.msRequestFullscreen) {
               element.msRequestFullscreen()
       } else if (element.webkitRequestFullscreen) {
            element.webkitRequestFullScreen()
        }
        }

# 103.关闭全屏 #

export function exitFullscreen() {
        if (document.exitFullscreen) {
            document.exitFullscreen()
        } else if (document.msExitFullscreen) {
            document.msExitFullscreen()
        } else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen()
        } else if (document.webkitExitFullscreen) {
            document.webkitExitFullscreen()
        }
    }

# 104.返回当前滚动条位置 #

export const getScrollPosition = (el = window) => ({
        x: el.pageXOffset !== undefined ? el.pageXOffset : el.scrollLeft,
        y: el.pageYOffset !== undefined ? el.pageYOffset : el.scrollTop
    });

# 105.滚动到指定元素区域 #

export const smoothScroll = element =>{
        document.querySelector(element).scrollIntoView({
            behavior: 'smooth'
        });
    };

# 106.平滑滚动到页面顶部 #

export const scrollToTop = () => {
        const c = document.documentElement.scrollTop || document.body.scrollTop;
        if (c > 0) {
            window.requestAnimationFrame(scrollToTop);
            window.scrollTo(0, c - c / 8);
        }
    };

# 107.http跳转https #

export const httpsRedirect = () => {
        if (location.protocol !== 'https:') location.replace('https://' + location.href.split('//')[1]);
    };

# 108.检查页面底部是否可见 #

export const bottomVisible = () =>{
        return document.documentElement.clientHeight + window.scrollY >=
            (document.documentElement.scrollHeight || document.documentElement.clientHeight);
    };

# 109.打开一个窗口 #

/**
         * @param { string } url
         * @param { string } windowName
         * @param { number } width
         * @param { number } height
           */
           export function openWindow(url, windowName, width, height) {
           var x = parseInt(screen.width / 2.0) - width / 2.0;
           var y = parseInt(screen.height / 2.0) - height / 2.0;
           var isMSIE = navigator.appName == "Microsoft Internet Explorer";
           if (isMSIE) {
               var p = "resizable=1,location=no,scrollbars=no,width=";
               p = p + width;
               p = p + ",height=";
               p = p + height;
               p = p + ",left=";
               p = p + x;
               p = p + ",top=";
               p = p + y;
               window.open(url, windowName, p);
           } else {
               var win = window.open(
                   url,
                   "ZyiisPopup",
                   "top=" +
                   y +
                   ",left=" +
                   x +
                   ",scrollbars=" +
                   scrollbars +
                   ",dialog=yes,modal=yes,width=" +
                   width +
                   ",height=" +
               height +
                ",resizable=no"
            );
            eval("try { win.resizeTo(width, height); } catch(e) { }");
            win.focus();
        }
        }

# 110.自适应页面（rem） #

/**
         * @param { number } width
           */
           export function AutoResponse(width = 750) {
           const target = document.documentElement;
       target.clientWidth >= 600
            ? (target.style.fontSize = "80px")
            : (target.style.fontSize = target.clientWidth / width * 100 + "px");
        }

# 日期工具date工具函数 #

# 111.浏览器存储相关storage工具函数 #

主要为浏览器存储方面的工具函数，大部分搬运自大神火狼1

# 112.localStorage 存贮 #

/**
         * 目前对象值如果是函数 、RegExp等特殊对象存贮会被忽略
         * @param { String } key  属性
     * @param { string } value 值
        */
        export const localStorageSet = (key, value) => {
        if (typeof (value) === 'object') value = JSON.stringify(value);
        localStorage.setItem(key, value)
        };

# 113.localStorage 获取 #

/**
         * @param {String} key  属性
       */
        export const localStorageGet = (key) => {
        return localStorage.getItem(key)
        };

# 114.localStorage 移除 #

/**
         * @param {String} key  属性
       */
        export const localStorageRemove = (key) => {
        localStorage.removeItem(key)
        };

# 115.localStorage 存贮某一段时间失效 #

/**
         * @param {String} key  属性
         * @param {*} value 存贮值
         * @param { number } expire 过期时间,毫秒数
           */
           export const localStorageSetExpire = (key, value, expire) => {
       if (typeof (value) === 'object') value = JSON.stringify(value);
        localStorage.setItem(key, value);
        setTimeout(() => {
            localStorage.removeItem(key)
        }, expire)
        };

# 116.sessionStorage 存贮 #

/**
         * @param {String} key  属性
         * @param {*} value 值
       */
        export const sessionStorageSet = (key, value) => {
        if (typeof (value) === 'object') value = JSON.stringify(value);
        sessionStorage.setItem(key, value)
        };

# 117.sessionStorage 获取 #

/**
         * @param {String} key  属性
       */
        export const sessionStorageGet = (key) => {
        return sessionStorage.getItem(key)
        };

# 118.sessionStorage 删除 #

/**
         * @param {String} key  属性
       */
        export const sessionStorageRemove = (key) => {
        sessionStorage.removeItem(key)
        };

# 119.sessionStorage 存贮某一段时间失效 #

/**
         * @param {String} key  属性
         * @param {*} value 存贮值
         * @param {String} expire 过期时间,毫秒数
           */
           export const sessionStorageSetExpire = (key, value, expire) => {
       if (typeof (value) === 'object') value = JSON.stringify(value);
        sessionStorage.setItem(key, value);
        setTimeout(() => {
            sessionStorage.removeItem(key)
        }, expire)
        };

# 120.cookie 存贮 #

/**
         * @param {String} key  属性
         * @param {*} value  值
         * @param { String } expire  过期时间,单位天
       */
        export const cookieSet = (key, value, expire) => {
        const d = new Date();
        d.setDate(d.getDate() + expire);
        document.cookie = `${key}=${value};expires=${d.toUTCString()}`
        };

# 121.cookie 获取 #

/**
         * @param {String} key  属性
           */
           export const cookieGet = (key) => {
           const cookieStr = unescape(document.cookie);
           const arr = cookieStr.split('; ');
           let cookieValue = '';
           for (let i = 0; i < arr.length; i++) {
               const temp = arr[i].split('=');
               if (temp[0] === key) {
                   cookieValue = temp[1];
                   break
           }
        }
        return cookieValue
        };

# 122.cookie 删除 #

/**
         * @param {String} key  属性
       */
        export const cookieRemove = (key) => {
        document.cookie = `${encodeURIComponent(key)}=;expires=${new Date()}`
        };

# 123.更多的工具函数 #

这里包含了平时可能常用的工具函数，包含数字，字符串，数组和对象等等操作。

# 124.金钱格式化，三位加逗号 #

/**
      *  @param { number } num
         */
         export const formatMoney = num => num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");

# 125.截取字符串并加身略号 #

export function subText(str, length) {
        if (str.length === 0) {
            return '';
        }
        if (str.length > length) {
            return str.substr(0, length) + "...";
        } else {
            return str;
        }
    }

# 126.获取文件base64编码 #

/**
         * @param file
         * @param format  指定文件格式
         * @param size  指定文件大小(字节)
         * @param formatMsg 格式错误提示
         * @param sizeMsg   大小超出限制提示
         * @returns {Promise<any>}
           */
           export function fileToBase64String(file, format = ['jpg', 'jpeg', 'png', 'gif'], size = 20 * 1024 * 1024, formatMsg = '文件格式不正确', sizeMsg = '文件大小超出限制') {
           return new Promise((resolve, reject) => {
               // 格式过滤
               let suffix = file.type.split('/')[1].toLowerCase();
               let inFormat = false;
               for (let i = 0; i < format.length; i++) {
                   if (suffix === format[i]) {
                       inFormat = true;
                       break;
                   }
               }
               if (!inFormat) {
                   reject(formatMsg);
               }
               // 大小过滤
               if (file.size > size) {
                   reject(sizeMsg);
               }
               // 转base64字符串
           let fileReader = new FileReader();
            fileReader.readAsDataURL(file);
            fileReader.onload = () => {
                let res = fileReader.result;
                resolve({base64String: res, suffix: suffix});
                reject('异常文件，请重新选择');
            }
        })
        }

# 127.B转换到KB,MB,GB并保留两位小数 #

/**
         * @param { number } fileSize
           */
           export function formatFileSize(fileSize) {
           let temp;
           if (fileSize < 1024) {
               return fileSize + 'B';
           } else if (fileSize < (1024 * 1024)) {
               temp = fileSize / 1024;
               temp = temp.toFixed(2);
               return temp + 'KB';
           } else if (fileSize < (1024 * 1024 * 1024)) {
               temp = fileSize / (1024 * 1024);
               temp = temp.toFixed(2);
               return temp + 'MB';
           } else {
               temp = fileSize / (1024 * 1024 * 1024);
           temp = temp.toFixed(2);
            return temp + 'GB';
        }
        }

# 128.base64转file #

/**
         *  @param { base64 } base64
         *  @param { string } filename 转换后的文件名
            */
            export const base64ToFile = (base64, filename )=> {
            let arr = base64.split(',');
            let mime = arr[0].match(/:(.*?);/)[1];
            let suffix = mime.split('/')[1] ;// 图片后缀
            let bstr = atob(arr[1]);
            let n = bstr.length;
            let u8arr = new Uint8Array(n);
        while (n--) {
             u8arr[n] = bstr.charCodeAt(n)
         }
         return new File([u8arr], `${filename}.${suffix}`, { type: mime })
         };

# 129.base64转blob #

/**
         *  @param { base64 } base64
            */
            export const base64ToBlob = base64 => {
            let arr = base64.split(','),
                mime = arr[0].match(/:(.*?);/)[1],
                bstr = atob(arr[1]),
                n = bstr.length,
                u8arr = new Uint8Array(n);
            while (n--) {
            u8arr[n] = bstr.charCodeAt(n);
         }
         return new Blob([u8arr], { type: mime });
         };

# 130.blob转file #

/**
        *  @param { blob } blob
        *  @param { string } fileName
           */
       export const blobToFile = (blob, fileName) => {
        blob.lastModifiedDate = new Date();
        blob.name = fileName;
        return blob;
        };
    复制代码