Question

如果在页面的任何位置调用Firebug的console，我希望能够以编程方式将<body>类添加到console.log()标记。然后，我可以在屏幕上添加一些令人讨厌的消息，提醒我不要使用那些仍在其中的语句部署代码。

与Eric Meyer的Diagnostic CSS非常相似。

有可能吗？

Answer 1

呵呵呵。这是一个容易犯的错误，不是吗。

选项1：始终只写if(window.console) console.log(...);而不只是console.log(..);

选项2：

function mydebug(thingtodebug) {
    if(window.console) console.log(thingtodebug);
}

..然后始终使用mydebug()而不是console.log();。如果未定义控制台，则可以包含一个else子句，该子句会抛出一个警告框。

选项3：

if(!window.console) {
    var console={
        log : function() {alert("Don't call console.log");}
    }
}

......这将完全符合您的要求。

问题在于，所有这些选项都需要在您的实时系统中加入额外的代码，以帮助您避免尴尬。（当然，如果你错过那个戒备箱，它会更加尴尬！）

如果您想避免这种情况，更好的解决方案可能是拥有一个单独的脚本，可以扫描代码中是否出现console.log。您可以在部署过程中运行此脚本。

希望有所帮助。

Answer 2

这很简单。只需使用您自己的控制台对象覆盖默认控制台对象：

<!DOCTYPE html>
<html>
    <head>
        <title>Console Test</title>
        <script>
            var oldConsole = (typeof window.console === "object") ? window.console : null;
            var console = {
                log: function() {
                    oldConsole.log(arguments);
                    document.body.className = "console";
                    alert('applied class');
                }
            };
        </script>
    </head>
    <body>
        <input type="button" value="click me" onclick="console.log('this is a test');">
    </body>
</html>

Live example.

确定是否在页面的任何位置调用Firebug的console.log（）

3 个答案: