浏览器Console对象部分API使用简述

1.清空控制台

使用console.clear()指令清空你的控制台。

2.控制台输出添加样式

你可以使用%c指令给你的输出指定样式:
console.log('%c Make console greate again!', 'font-size:50px; background:red;')

Paste_Image.png

3.显示表格样式的数据

使用console.table(object),提供一个对象,让它像表格一样显示:

让我们来试试:

persons = [ { name: 'Hien Vuong', city: 'Ho Chi Minh' }, { name: 'Donald Trump', city: 'New York' }]

console.table(persons)
Paste_Image.png

4.分组输出数据

使用console.group(message)和console.groupEnd()指令,用下拉列表的形式分组输出全部日志。

让我们用上面的persons对象试试:
···
persons.forEach(p => {
console.group();
console.log(This is ${p.name});
console.log(He comes from ${p.city});
console.groupEnd();
});
···

Paste_Image.png

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,288评论 19 139
  • 前言 Chrome浏览器我想是每一个前端er必用工具之一吧,一部分原因是它速度快,体积不大,支持的新特性也比其它浏...
    LiLi原上草阅读 1,310评论 0 0
  • 对于js的调试,一般我们经常用alert()或者console.log()进行调试。但是alert()会让程序中断...
    猪猪侠闯天下阅读 854评论 0 0
  • 前言 相信无论是对于身居一线的coder,还是退居多年的老司机managers来说,对于调试程序是不陌生的,对于w...
    itclanCoder阅读 2,680评论 0 7
  • 前言 Chrome浏览器我想是每一个前端er必用工具之一吧,一部分原因是它速度快,体积不大,支持的新特性也比其它浏...
    余平的余_余平的平阅读 438评论 0 1