jquery日志模块包含生成txt文件(不需要后台)

小灰灰 2023-02-23 12:28 9阅读 0赞

### 先整个DIV装日志 样式随便整 ###

### js：  ###

### 和后台交互 需要打印的日志调用outLogs("需要打印的日志"); ###

### 我写的新日志加在最前面一行 需要用换顺序的prepend改成append丢日志div就行了 ###

//输入日志
    function outLogs(log) {
        var myDate = dateFormat("YYYY mm-dd HH:MM:SS", new Date());
        $("#model_logs").prepend('<p>[' + myDate + '] ' + log + '</p>');
    }
    
    
    //生成下载日志文件
    function downloadLogs() {
        var logs = $("#model_logs").html().replace(/<p>/g, "");
        //替换</p>为"\r\n" windows txt中的换行符
        logs = logs.replace(/<\/p>/g, "\r\n");
        var filename = dateFormat("YYYYmmddHHMMSS", new Date()) + ".txt";
        var element = document.createElement('a');
        element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(logs));
        element.setAttribute('download', filename);
        element.style.display = 'none';
        document.body.appendChild(element);
        element.click();
        document.body.removeChild(element);
    }
    
    //格式化时间
    function dateFormat(fmt, date) {
        let ret;
        const opt = {
            "Y+": date.getFullYear().toString(),        // 年
            "m+": (date.getMonth() + 1).toString(),     // 月
            "d+": date.getDate().toString(),            // 日
            "H+": date.getHours().toString(),           // 时
            "M+": date.getMinutes().toString(),         // 分
            "S+": date.getSeconds().toString()          // 秒
            // 有其他格式化字符需求可以继续添加，必须转化成字符串
        };
        for (let k in opt) {
            ret = new RegExp("(" + k + ")").exec(fmt);
            if (ret) {
                fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
            }
            ;
        }
        ;
        return fmt;
    }

### 界面： ###

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDE5NTQyMg_size_16_color_FFFFFF_t_70][]

### 调用downloadLogs()导出的TXT如图: ###

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDE5NTQyMg_size_16_color_FFFFFF_t_70 1][]

顺颂时祺

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDE5NTQyMg_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200707180628574.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDE5NTQyMg==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDE5NTQyMg_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20200707180730635.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDE5NTQyMg==,size_16,color_FFFFFF,t_70