分享你我的心得.
共乘一片美好网络.

JS console.log 使用小技巧(多种样式)

1. console.log( ) | info( ) | debug( ) | warn( ) | error( )

根据事件的类型不同,会带有不同的颜色

console log/info/debug/warn/error

2. 使用占位符

占位符的使用有以下情况

%o   ——代表用对象来替换

%s   ——代表用字符串来替换

%d   ——代表用数字来替换

placeholders

3. 添加css 到 输出信息

你是否会觉得所有的信息看起来都是一样的?从现在起一切都会变得不同,让你的信息众多的信息中更突出。

Messages with colors

怎么样突出日志中特殊的词?像这样 😄

highlighting specific word

4. console.dir( )

打印一个JSON 对象

5. 打印HTML 

获取html 元素,像是一个特殊的元素

6.console.table ( )

用一种易于理解的方案展示JSON

7. console.group( ) & console.groupEnd( )

让日志信息实现分组

8.console.count( )

这个方法可以打印count() 被调用的次数,方法接受一个参数 label 如果提供label 这个方法就会按照 label 来统计次数,如果没有提供,这个方法就会统计所处的位置上的调用次数。

9.console.assert()

这个方法提供选择性打印日志,该方法只会在一个参数为false的情况下执行,为true时什么都不执行。

10.console.trace( )

这个方法用来追踪函数的调用轨迹

11.console.time( )

这个方法可以用来让WEB开发人员测量一个javascript脚本程序执行消耗的时间

12.console.memory( )

展示javaScript 应用使用了多少浏览器的内存

13.console.clear( )

这是最后一个函数了,但不是最新的函数😁, 清理掉所有打印的信息。

赞(0)
未经允许不得转载:小叶白龙博客 » JS console.log 使用小技巧(多种样式)
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址