javascript - 将所有 Javascript 控制台输出发送到 DOM 元素

Question

如何将所有控制台输出发送到 DOM 元素，以便无需打开任何开发人员工具即可查看？我想看到所有输出，例如 JS 错误、console.log() 输出等。

Answer 1

我发现上面接受的答案很有帮助，但它确实有几个问题，如评论中所示:

1) 在 Chrome 中不起作用，因为“前者”没有考虑到 this 上下文不再是控制台，解决方法是使用 JavaScript apply 方法。

2) 它不考虑传递给 console.log 的多个参数

我也希望它可以在没有 jQuery 的情况下工作。

    var baseLogFunction = console.log;
    console.log = function(){
        baseLogFunction.apply(console, arguments);

        var args = Array.prototype.slice.call(arguments);
        for(var i=0;i<args.length;i++){
            var node = createLogNode(args[i]);
            document.querySelector("#mylog").appendChild(node);
        }

    }

    function createLogNode(message){
        var node = document.createElement("div");
        var textNode = document.createTextNode(message);
        node.appendChild(textNode);
        return node;
    }

    window.onerror = function(message, url, linenumber) {
        console.log("JavaScript error: " + message + " on line " +
            linenumber + " for " + url);
    }

这是一个包含这些更改的更新工作示例。 http://jsfiddle.net/eca7gcLz/