[Javascript] Format console.log with CSS and String Template Tags
The Chrome console allows you to format messages using CSS properties. This lesson walks you through the syntax of formatting your logs with css then refactoring into a template tag function to make formatting more reusable.
const debug = (label, style, obj) => {
console.log(`%c${label}`, `${style}`, `${obj}`);
}; debug(
`debug: `,
`color: white; background-color: grey; padding: .5em;`,
JSON.stringify({name: 'Zhentian'}));
[Javascript] Format console.log with CSS and String Template Tags的更多相关文章
- [Javascript] Advanced Console Log Arguments
Get more mileage from your console output by going beyond mere string logging - log entire introspec ...
- Javascript的console.log()用法
Firebug & Chrome Console 控制台的一些其他功能console.log(object[, object, ...])使用频率最高的一条语句:向控制台输出一条消息.支持 C ...
- (转)Javascript中console.log()用法
原文地址应该是这个吧:http://my.oschina.net/junn/blog/142728 注意:必须要提前打开IE的开发者模式才能看到输入 否则就会报错. IE下可以这个判断: if (co ...
- javascript的console.log用法
f1.html代码 <iframe id="frame2" name="frame1" src="ww.html"></i ...
- javascript:console.log()是什么js库里的?
这个不是什么库的,这个是浏览器的函数,如果你使用firefox并且装有firebug插件,当使用console.log(……)时,会把括号内的字符串输出到控制台,当然,在IE中这个是没有的,要报错.相 ...
- javascript篇-console.log()打印object却显示为字符串[object object]
console.log打印对象遇到的一个问题,如下截图 打印结果与预期不符,原因是因为字符串‘a’和对象object拼接在一起,拼成了一个字符串
- Javascript 将 console.log 日志打印到 html 页面中
如何将 console.log() 打印的日志输出到 html 页面中 (function () { var old = console.log; var logger = document.getE ...
- 七、JavaScript之console.log输出和document.write输出
一.代码如下 二.运行效果如下 三.点击之后,效果如下 四.按一下F12,在控制台中可以看到
- console.log()显示图片以及为文字加样式
有兴趣的同学可以文章最后的代码复制贴到控制台玩玩. Go for Code 在正常模式下,一般只能向console 控制台输出简单的文字信息.但为了把信息输出得更优雅更便于阅读,除了cosole.lo ...
随机推荐
- java 并发原子性与易变性 来自thinking in java4 21.3.3
java 并发原子性与易变性 具体介绍请參阅thinking in java4 21.3.3 thinking in java 4免费下载:http://download.csdn.net/deta ...
- Android学习笔记进阶八之Matrix矩阵
Matrix,中文里叫矩阵,高等数学里有介绍,在图像处理方面,主要是用于平面的缩放.平移.旋转等操作. 在Android里面,Matrix由9个float值构成,是一个3*3的矩阵.最好记住.如下图: ...
- 关于hadoop hdfs里文件为啥上一级大小是0,进去又有大小问题解释?
问题 好像跟平时的理解不一样,外边是0,进去就是有大小了? 答:hdfs具体文件是针对具体文件的,不是文件目录. 文件夹大小为0,不是里面所有内容为0.
- 原生js大总结六
051.如何打印当前浏览器的版本等信息 navigator.userAgent 返回包含浏览器版本等信息的字符串 ,常用于判断浏览器版本及使用设备(PC或者移动端 052 .在浏览器地址栏 ...
- 【例题 7-10 UVA - 11212】Editing a Book
[链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 迭代加深搜. 很容易想到,最多只要搜8层就可以得到答案了 ->最多8下肯定可以还原. 则枚举一下最大层数.然后做个深搜就好. ...
- controller接收参数的对象是vo还是dto?
我也没有深入了解过,就我使用情况来说的话,VO和DTO在实际开发过程中其实可以是一样的.从定义上来说他们区别于使用的所在层,VO(view object)视图对象,DTO(Data Transfer ...
- 1.2 Python基础知识 - 字符编码
计算机中的数据是以二进制方式进行存储的,即只有"0"和"1",二进制是属于数据类型的数据,它只可以和其他进制的数据类型进行转换,但是不能存储其他字符,例如:字母 ...
- SQL判断空值、nvl处理与JOIN的使用
LIKE子句会影响查询性能,所以在明确知道字符个数时,应该使用'_',而不使用'%'. 判断空值/非空值 SELECT select_list FROM table_list/view_list WH ...
- REGEXP_LIKE,REGEXP_INSTR,REGEXP_SUBSTR,REGEXP_REPLACE
参考: http://www.cnblogs.com/scottckt/archive/2012/10/11/2719562.html http://www.jb51.net/article/3842 ...
- HDU 1251统计难题 字典树
字典树的应用. 数据结构第一次课的作业竟然就需要用到树了!!!这不科学啊.赶紧来熟悉一下字典树. 空间开销太大T T #include<cstdio> #include<cstrin ...