Chrome 调试器 - 如何关闭 console.log 消息分组?

IT技术 javascript google-chrome google-chrome-extension google-chrome-devtools
2021-03-08 04:17:56

说,在我的 Google Chrome 扩展程序中,我这样做:

console.log(msg);

Chrome 调试器将类似的消息分组如下:

在此处输入图片说明

有没有什么可以关闭它并按原样发布消息?

4个回答

它只会折叠相同的连续行,我认为这不是什么大问题,但是使用控制台右上角的设置按钮,您可以启用“显示时间戳”,这会将它们放在不同的行上:

在此处输入图片说明

您可以看到它们只折叠连续的重复项:

msgs = ['hello', 'world', 'there'];
for (i = 0; i < 20; i++) console.log(msgs[Math.floor((i/3)%3)]) 

控制台API有很多其他的功能,可以帮助您按照您的代码。例如,console.count(label)带有记录次数的日志标签,console.group()让您可以将其他日志记录调用组合在一起,并console.timeline(label)让您将日志分组到时间线中。

顺序没变
2021-05-01 04:17:56
显然,如果我启用时间戳,它就不会发生。你有没有阅读我上面对你帖子的第一个回复?
2021-05-01 04:17:56
我不相信你,你能展示你的代码吗?运行我的示例代码,您可以看到 'hello' 显示在三组中,并且单词按顺序显示。同时打开时间戳,它会为您取消对您的日志的分组并发布。
2021-05-11 04:17:56
我可以自己加一个时间戳来解决这个问题。你看,这不必要地使日志混乱。显然,编写该控制台日志的人并不认为消息的顺序很重要(即使其中一些是相同的。)
2021-05-17 04:17:56
是的。在我的屏幕截图中,这些消息可以是这样的:Page=, iframe, iframe, Page=, iframeiframe但控制台显示它的方式不保留此顺序。
2021-05-20 04:17:56

有人在那里遇到了同样的问题:Google Chrome 开发者工具控制台日志记录……几乎没用?没有答案禁用此功能。

作为解决方法,您可以在开发人员工具设置中为控制台启用显示时间戳

谢谢。这似乎是一种解决方法,但不是实际的解决方案。我也最终使用了时间戳。太糟糕了,没有按钮可以禁用它。这是 Google 开发人员过度思考的一个很好的例子
2021-04-26 04:17:56
@c00000fd 同意,这是控制台的一个令人压抑的设计方面,将消息分组而无法禁用它。在我的情况下,时间戳显示消息不按时间顺序排列,但启用它们并不能将它们按顺序排列。因此,如果我必须在我的肉类计算机中对时间戳进行排序以确定实际序列,那么这是一个非常弱的茶解决方法。
2021-05-16 04:17:56

在控制台窗口的右上角,有一个齿轮按钮,可以打开一个面板,其中包含一个名为“组相似”的设置。如果您取消选中此复选框,类似的日志条目将不再组合在一起。

在此处输入图片说明

这是正确的答案,时间戳技巧从 Chrome 88 开始不起作用
2021-04-27 04:17:56
我是较新版本的 Chrome,这现在称为“在控制台中分组类似消息”
2021-05-13 04:17:56

消息相同时,消息才会与之前的消息折叠
为了防止消息被折叠,您可以交替日志级别,或使用交替日志输出。

console.log并且console.debug在 Chrome 的 devtools 中在视觉上相似(即它前面没有图标)。如果您不使用冗长过滤器,则在console.log之间交替console.debug将解决您的问题:

console.log('message');
console.debug('message');
console.log('message');

// Convenience function:
function log() {
    log.counter = log.counter ? log.counter + 1 : 1;
    console[log.counter % 2 ? 'log' : 'debug'].apply(console, arguments);
}

获得所需结果的另一种方法是在消息前面插入一个不可见字符(注意:我%s用来防止出现额外的空格(请参阅devtools 格式选项),还有一个 ZWSP 以防止任何可见字符出现在全部):

function log() {
    log.counter = log.counter ? log.counter + 1 : 1;
    var args = [].slice.call(arguments);
    if (log.counter % 2) {
        args.unshift('%s\u200B'); // ZWSP (zero-width space, you won't see it)
    }
    console.log.apply(console, args);
}

演示:http : //jsfiddle.net/x3725j38/1/