手机调试log 问题

web修理工

已于 2023-08-24 14:22:51 修改

阅读量110

点赞数

分类专栏： JavaScript 文章标签： javascript html

于 2021-10-15 18:41:20 首次发布

本文链接：https://blog.csdn.net/qq_42374676/article/details/120788801

版权

JavaScript 专栏收录该内容

163 篇文章 2 订阅

订阅专栏

这是一个关于手机vlog插件的HTML页面，包含了一个用于记录日志的简单logger对象。logger提供了debug、info、warn和error四个级别，用于不同类型的日志输出。当loggerDebug为true时，日志会显示在页面上，否则输出到console。点击按钮可以触发info级别的日志输出。

摘要由CSDN通过智能技术生成

手机vlog插件:https://gitee.com/mirrors/vConsole


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        @keyframes identifier {}
    </style>
</head>

<body>
    <button onclick="log()">log</button>

    <script>
        const loggerDebug = true;
        const logger = {};

        logger.debug = function (str) {
            logger.log(str, "debug");
        };

        logger.info = function (str) {
            logger.log(str, "info");
        };

        logger.warn = function (str) {
            logger.log(str, "warn");
        };

        logger.error = function (str) {
            logger.log(str, "error");
        };

        logger.log = function (str, level) {
            if (loggerDebug) {
                let logNode = document.querySelector("#j-log");
                if (logNode == null) {
                    logNode = document.createElement("div");
                    document.head()
                    let str = `
                      <div calss='log'><div>
                     `
                    logNode.innerHTML = str;
                    document.getElementsByTagName("body")[0].appendChild(logNode);
                }

                const pNode = document.createElement("p");
                if (level === "warn") {
                    pNode.style.color = "#c7be47";
                } else if (level === "error") {
                    pNode.style.color = "#ff0000";
                }

                console.log(str, typeof (str))
                pNode.innerText = typeof (str) === 'object' ? JSON.stringify(str) : String(str);
                logNode.appendChild(pNode);
            } else {
                console.log(str)
            }
        };
    </script>
    <script>
        function log() {
            logger.info('h5')
        }
    </script>
</body>

</html>