我如何打印调试消息在谷歌Chrome JavaScript控制台?

请注意,JavaScript控制台和JavaScript调试器是不一样的;它们有不同的语法AFAIK,所以在JavaScript调试器中的打印命令在这里将不起作用。在JavaScript控制台中,print()会将参数发送给打印机。


当前回答

下面是一个简短的脚本,用于检查控制台是否可用。如果没有,它会尝试加载Firebug,如果Firebug不可用,它会加载Firebug Lite。现在您可以在任何浏览器中使用console.log。享受吧!

if (!window['console']) {

    // Enable console
    if (window['loadFirebugConsole']) {
        window.loadFirebugConsole();
    }
    else {
        // No console, use Firebug Lite
        var firebugLite = function(F, i, r, e, b, u, g, L, I, T, E) {
            if (F.getElementById(b))
                return;
            E = F[i+'NS']&&F.documentElement.namespaceURI;
            E = E ? F[i + 'NS'](E, 'script') : F[i]('script');
            E[r]('id', b);
            E[r]('src', I + g + T);
            E[r](b, u);
            (F[e]('head')[0] || F[e]('body')[0]).appendChild(E);
            E = new Image;
            E[r]('src', I + L);
        };
        firebugLite(
            document, 'createElement', 'setAttribute', 'getElementsByTagName',
            'FirebugLite', '4', 'firebug-lite.js',
            'releases/lite/latest/skin/xp/sprite.png',
            'https://getfirebug.com/', '#startOpened');
    }
}
else {
    // Console is already available, no action needed.
}

其他回答

你可以使用console.log()如果你在什么编程软件编辑器中有一个调试代码,你会看到输出很可能是我最好的编辑器(谷歌Chrome)。只需按F12,然后按控制台选项卡。您将看到结果。快乐的编码。:)

改进Andru的想法,你可以写一个脚本来创建控制台函数,如果他们不存在:

if (!window.console) console = {};
console.log = console.log || function(){};
console.warn = console.warn || function(){};
console.error = console.error || function(){};
console.info = console.info || function(){};

然后,使用以下任何一种方法:

console.log(...);
console.error(...);
console.info(...);
console.warn(...);

这些函数将记录不同类型的项目(可以根据log, info, error或warn进行过滤),并且在控制台不可用时不会导致错误。这些功能将在Firebug和Chrome控制台中工作。

进一步完善Delan和Andru的观点(这就是为什么这个答案是编辑版本);Console.log可能存在,而其他函数可能不存在,因此默认映射到与Console.log ....相同的函数

你可以写一个脚本来创建不存在的控制台函数:

if (!window.console) console = {};
console.log = console.log || function(){};
console.warn = console.warn || console.log;  // defaults to log
console.error = console.error || console.log; // defaults to log
console.info = console.info || console.log; // defaults to log

然后,使用以下任何一种方法:

console.log(...);
console.error(...);
console.info(...);
console.warn(...);

这些函数将记录不同类型的项目(可以根据log, info, error或warn进行过滤),并且在控制台不可用时不会导致错误。这些功能将在Firebug和Chrome控制台中工作。

我个人使用这个,它类似于tarek11011的:

// Use a less-common namespace than just 'log'
function myLog(msg)
{
    // Attempt to send a message to the console
    try
    {
        console.log(msg);
    }
    // Fail gracefully if it does not exist
    catch(e){}
}

主要的一点是,至少有一些日志记录的实践,而不仅仅是将console.log()直接插入到JavaScript代码中,这是一个好主意,因为如果您忘记了它,而它位于生产站点上,它可能会破坏该页面的所有JavaScript代码。

只需要添加一个许多开发者忽略的功能:

console.log("this is %o, event is %o, host is %s", this, e, location.host);

这是JavaScript对象的可点击和深度浏览内容的神奇%o转储。%s只是一个记录。

这个也很酷:

console.log("%s", new Error().stack);

它提供到新的Error()调用点的类似java的堆栈跟踪(包括文件路径和行号!)

%o和new Error()。堆栈可用在Chrome和Firefox!

在Firefox中也可以使用堆栈跟踪:

console.trace();

正如https://developer.mozilla.org/en-US/docs/Web/API/console所说。

黑客快乐!

更新:一些库是由坏人编写的,他们为了自己的目的重新定义了控制台对象。要在加载库后恢复原始的浏览器控制台,请使用:

delete console.log;
delete console.warn;
....

参见堆栈溢出问题恢复console.log()。