[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 ...
随机推荐
- sass自定义滚动条样式
@mixin scrollBarStyle() { &::-webkit-scrollbar { width: 7px; height: 7px; } &::-webkit-scrol ...
- 趣闻|Python之禅(The Zen of Python)
在Python解释器中输入“import this”会发生什么?如果你不知道这个彩蛋,推荐继续阅读这篇文章. 2001年秋,Foretec(一家会议组织公司)正在准备召开第十届Internationa ...
- 将二级目录下的文件合并成一个文件的Python小脚本
这个小程序的目的是将二级目录下的文件全部合并成一个文件(其实几级目录都可以,只要做少许改动) #coding:utf8 import sys, os def process(path): new_fi ...
- 优秀Java程序员必备10招
1. 拥有扎实的基础和深刻理解 OO 原则 对于 Java 程序员,深刻理解 ObjectOriented Programming(面向对象编程)这一概念是必须的.没有 OOPS 的坚实基础,就领会不 ...
- RMAN DUPLICATE ADG DEMO
RMAN DUPLICATE ADG DEMO 生产环境谨慎使用,建议生产环境采用RMAN备份恢复的方式. 本演示案例所用环境: primary standby OS Hostname pry s ...
- JSON序列化和解析
1.JSON.stringfy()用于将 JavaScript 值转换为 JSON 字符串 2.JSON.parse()用于将一个 JSON 字符串转换为 JavaScript 对象. 3.JSON. ...
- CSDN博客的文章分类和战略规划
CSDN原创文章已经有300多篇了,现在已经整理了好多个分类目录了. 今天,特别向大家介绍下,每个分类的含义和规划. CSDN博客是我的一个重要的自媒体,也是我的一个战略实践. 我会精心维护这个博客, ...
- 推荐一款优雅高效的免费在线APP原型工具
有段时间没有推荐干货给大伙了,今天是时候把压箱底的东西拿出来分享给大家了! 想要学习原型图绘制的小伙伴可以看过来,适合零基础的小白,五分钟就可以上手,绘制自己想要的产品原型图. 官方介绍:用户只需输入 ...
- Dynamic device virtualization
A system and method for providing dynamic device virtualization is herein disclosed. According to on ...
- [Angular] Setup automated deployment with Angular, Travis and Firebase
Automate all the things!! Automation is crucial for increasing the quality and productivity. In this ...