Archive for the category: 6.前端开发

function isMobile() {
    return /Mobi|Android|iPhone/i.test(navigator.userAgent);
}

function getOffsetTop(el) {
    let offset = 0;
    while (el) {
        offset += el.offsetTop;
        el = el.offsetParent;
    }
    return offset;
}

3. 防抖函数 debounce

function debounce(fn, delay = 300) {
    let timer;
    return function (...args) {
        clearTimeout(timer);
        timer = setTimeout(() => fn.apply(this, args), delay);
    };
}

function throttle(fn, delay = 300) {
    let last = 0;
    return function (...args) {
        const now = Date.now();
        if (now - last > delay) {
            last = now;
            fn.apply(this, args);
        }
    };
}

function copyToClipboard(text) {
    navigator.clipboard.writeText(text);
}

function scrollToTop() {
    window.scrollTo({top: 0, behavior: 'smooth'});
}

function isEmptyObject(obj) {
    return Object.keys(obj).length === 0 && obj.constructor === Object;
}

function unique(arr) {
    return [...new Set(arr)];
}

function randomColor() {
    return `#${Math.random().toString(16).slice(2, 8)}`;
}

function getQueryParam(name) {
    return new URLSearchParams(window.location.search).get(name);
}

function isLeapYear(year) {
    return (year % 4 === 0 && year % 100 !== 0) || year % 400 === 0;
}

function shuffle(arr) {
    for (let i = arr.length - 1; i > 0; i--) {
        const j = Math.floor(Math.random() * (i + 1));
        [arr[i], arr[j]] = [arr[j], arr[i]];
    }
    return arr;
}

function getCookie(name) {
    const match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
    return match ? decodeURIComponent(match[2]) : null;
}

function setCookie(name, value, days = 7) {
    const d = new Date();
    d.setTime(d.getTime() + days * 24 * 60 * 60 * 1000);
    document.cookie = `${name}=${encodeURIComponent(value)};expires=${d.toUTCString()};path=/`;
}

function deleteCookie(name) {
    setCookie(name, '', -1);
}

function isInViewport(el) {
    const rect = el.getBoundingClientRect();
    return rect.top >= 0 && rect.left >= 0 && rect.bottom <= window.innerHeight && rect.right <= window.innerWidth;
}

function getTimeString() {
    return new Date().toLocaleString();
}

const ro = new ResizeObserver(entries => {
    for (let entry of entries) {
        console.log('size changed:', entry.contentRect);
    }
});
ro.observe(document.querySelector('#app'));

function getBrowser() {
    const ua = navigator.userAgent;
    if (/chrome/i.test(ua)) return 'Chrome';
    if (/firefox/i.test(ua)) return 'Firefox';
    if (/safari/i.test(ua)) return 'Safari';
    if (/msie|trident/i.test(ua)) return 'IE';
    return 'Unknown';
}

document.addEventListener('visibilitychange', () => {
    if (document.hidden) {
        console.log('页面不可见');
    } else {
        console.log('页面可见');
    }
});

function isImageLoaded(img) {
    return img.complete && img.naturalWidth !== 0;
}

function getStyle(el, prop) {
    return window.getComputedStyle(el)[prop];
}

document.addEventListener('paste', e => {
    const text = e.clipboardData.getData('text');
    console.log('粘贴内容：', text);
});

function isJSON(str) {
    try {
        JSON.parse(str);
        return true;
    } catch {
        return false;
    }
}

function randomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

window.addEventListener('resize', () => {
    console.log('窗口尺寸变化:', window.innerWidth, window.innerHeight);
});

function isEmail(str) {
    return /^[\w.-]+@[\w.-]+\.\w+$/.test(str);
}

function isPhone(str) {
    return /^1[3-9]\d{9}$/.test(str);
}

function diffDays(date1, date2) {
    const t1 = new Date(date1).getTime();
    const t2 = new Date(date2).getTime();
    return Math.abs(Math.floor((t2 - t1) / (24 * 3600 * 1000)));
}

document.addEventListener('keydown', e => {
    console.log('按下了：', e.key);
});

function getScrollTop() {
    return window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
}

function isNumber(val) {
    return typeof val === 'number' && !isNaN(val);
}

function uniqueId() {
    return Date.now().toString(36) + Math.random().toString(36).substr(2, 5);
}

document.addEventListener('contextmenu', e => {
    e.preventDefault();
    console.log('右键菜单被触发');
});

function isFunction(val) {
    return typeof val === 'function';
}

function getItemByLocal(key) {
    return localStorage.getItem(key);
}

function setItemByLocal(key, value) {
    localStorage.setItem(key, value);
}

function removeItemLocal(key) {
    localStorage.removeItem(key);
}

function isPromise(obj) {
    return !!obj && (typeof obj === 'object' || typeof obj === 'function') && typeof obj.then === 'function';
}

function getPath() {
    return window.location.pathname;
}

document.addEventListener('copy', e => {
    console.log('内容已复制到剪贴板');
});

function isArray(val) {
    return Array.isArray(val);
}

function getSize(el) {
    return {width: el.offsetWidth, height: el.offsetHeight};
}

function isBoolean(val) {
    return typeof val === 'boolean';
}

window.addEventListener('scroll', () => {
    console.log('页面滚动了');
});

function isObject(val) {
    return val !== null && typeof val === 'object' && !Array.isArray(val);
}

function getHost() {
    return window.location.host;
}

function isEmptyTirm(str) {
    return typeof str === 'string' && str.trim() === '';
}

window.addEventListener('focus', () => console.log('获得焦点'));
window.addEventListener('blur', () => console.log('失去焦点'));

function isElement(obj) {
    return obj instanceof Element;
}