一些js功能代码

clearmind
30
2024-12-03

1、导入存在两个格式的时间的解析

解析 30-十一月-20292024/11/28 两种格式的时间(从Excel中读取的时间数据)

function parseDate(dateStr) {
    let date;

    // 第一种格式: "30-十一月-2029"
    const regex1 = /(\d{1,2})-(一|二|三|四|五|六|七|八|九|十|十一|十二)月-(\d{4})/; // 匹配汉字月份
    const match1 = dateStr.match(regex1);
    if (match1) {
        const day = match1[1];
        const monthStr = match1[2];
        const year = match1[3];
        // 汉字月份转换为数字
        const monthMap = {
            '一': 0,
            '二': 1,
            '三': 2,
            '四': 3,
            '五': 4,
            '六': 5,
            '七': 6,
            '八': 7,
            '九': 8,
            '十': 9,
            '十一': 10,
            '十二': 11
        };
        const month = monthMap[monthStr + ""];
        if (month !== undefined) {
            date = new Date(year, month, day);
            return date;
        }
    }

    // 第二种格式: "2024/11/28"
    const regex2 = /(\d{4})\/(\d{1,2})\/(\d{1,2})/;
    const match2 = dateStr.match(regex2);
    if (match2) {
        const year = match2[1];
        const month = parseInt(match2[2], 10) - 1; // 月份从0开始
        const day = match2[3];

        date = new Date(year, month, day);
        return date;
    }

    // 如果没有匹配到,返回 null
    return null;
}

// 测试示例
const date1 = "30-十一月-2029";
const date2 = "2024/11/28";

console.log(parseDate(date1)); // 输出: Fri Nov 30 2029 00:00:00 GMT+0000 (UTC)
console.log(parseDate(date2)); // 输出: Thu Nov 28 2024 00:00:00 GMT+0000 (UTC)

2、模拟输入的场景

在有些React/Vue生成的页面中,直接使用js的.value方法赋值是不行的,没法激活响应,这时候就需要使用浏览器的事件来模拟来模拟输入,下方是一个CRM促销添加的 demo,用于配合Automa插件中的JS代码执行使用

// 值修改函数
async function updateDivValue(selector, value) {
    // 1. 找到目标元素
    const element = document.querySelector(selector);
    if (!element) return;

    // 2. 模拟点击进入编辑状态
    element.click();
    
    // 等待编辑状态准备就绪
    await new Promise(resolve => setTimeout(resolve, 200));

    // 3. 模拟键盘删除原有内容
    const backspaceCount = element.textContent.length;
    for (let i = 0; i < backspaceCount; i++) {
        element.dispatchEvent(new KeyboardEvent('keydown', {
            key: 'Backspace',
            code: 'Backspace',
            keyCode: 8,
            which: 8,
            bubbles: true,
            cancelable: true
        }));
    }
    
    // 4. 逐个字符输入新值
    for (const char of value.toString()) {
        // 模拟按键按下
        element.dispatchEvent(new KeyboardEvent('keydown', {
            key: char,
            char: char,
            bubbles: true,
            cancelable: true
        }));
        
        // 插入字符
        if (document.execCommand) {
            document.execCommand('insertText', false, char);
        } else {
            element.textContent += char;
        }
        
        // 模拟按键抬起
        element.dispatchEvent(new KeyboardEvent('keyup', {
            key: char,
            char: char,
            bubbles: true,
            cancelable: true
        }));
        
        // 触发input事件
        element.dispatchEvent(new Event('input', {
            bubbles: true,
            cancelable: true
        }));
        
        // 稍微延迟一下模拟真实输入
        await new Promise(resolve => setTimeout(resolve, 50));
    }

    // 5. 模拟按下回车确认
    element.dispatchEvent(new KeyboardEvent('keydown', {
        key: 'Enter',
        code: 'Enter',
        keyCode: 13,
        which: 13,
        bubbles: true,
        cancelable: true
    }));
    
    element.dispatchEvent(new KeyboardEvent('keyup', {
        key: 'Enter',
        code: 'Enter',
        keyCode: 13,
        which: 13,
        bubbles: true,
        cancelable: true
    }));
}

// 定义买多少送多少
const purchaseNumbers = 12;
const giftProductNumbers = 1;

// 创建一个异步函数来遍历每一行 tr
async function updateValues() {
    for (let i = 1; i <= 10; i++) {
        // 获取对应的 tr
        const purchaseNumSelector = `.tr:nth-child(${i}) > .td-purchase_num .td-cell-edit[data-name="purchase_num"]`;
        const giftProductNumSelector = `.tr:nth-child(${i}) > .td-gift_product_num .td-cell-edit[data-name="gift_product_num"]`;
        
        await updateDivValue(purchaseNumSelector, purchaseNumbers * i);
        await updateDivValue(giftProductNumSelector, giftProductNumbers * i);
    }
}

// 调用异步函数
updateValues();
动物装饰