javascript - すべての Javascript コンソール出力を DOM 要素に送信する

Question

すべてのコンソール出力を DOM 要素に送信して、開発者ツールを開かなくても表示できるようにするにはどうすればよいでしょうか? console.log()JS エラー、出力など、すべての出力を見たいのですが。

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/