console.log()用法,相信大家都很熟悉了,这里就不再啰嗦。

下面来玩几个新鲜点的,我用的是chrome28,不保证兼容其他浏览器:
console.log的第一个参数中可以指定一个格式字符,这样第二个参数就可以定义替换文本或其他内容。
%c表示定义一个用于显示参数内容的css样式
%s表示定义替换文本

1. 给输出到控制台的内容定义颜色、字体等
console.log(‘%cHello World’, ‘color: #00c’)
console.log(‘%cHello %cWorld’, ‘color: #00c’, ‘color:#0c0;font-size:18px;’)
参数中的占位符可定义多个,如参数个数不够时,会将占位符原样输出,如:
console.log(‘%cHello %cWord’, ‘color:#0f0′)

2. 让输出的内容别靠左边那么近
console.log(‘%cHello World’, ‘color: #c00; margin-left:20px’)

3. 输出一个警告的小icon
console.warn(‘%cHello World’, ‘color: #c00; margin-left:20px’)

4. 输出背影图片
console.log(‘%cB’,'background:url(“http://cdn.iknow.bdimg.com/static/common/pkg/module_z2d468dd4.png”) -140px 0;padding:22px 67px;line-height:44px;font-size:0;’);

补充一下,group也挺好用,试试这个:
console.group('Group by');console.log('Test 1');console.log('Test 2');console.groupEnd();

或者这样:
console.groupCollapsed('Group by');console.log('Test 1');console.log('Test 2');console.groupEnd()

前一个是默认展开的,后一个是默认收起了。

console 高级用法的更多相关文章

  1. [转] console.log的高级用法

    //基本用法 console.log('最常见用法\n换行'); console.error('输出错误信息 会以红色显示'); console.warn('打印警告信息 会以黄色显示'); cons ...

  2. console.log的高级用法

    //基本用法 console.log('最常见用法\n换行'); console.error('输出错误信息 会以红色显示'); console.warn('打印警告信息 会以黄色显示'); cons ...

  3. SolrNet高级用法(分页、Facet查询、任意分组)

    前言 如果你在系统中用到了Solr的话,那么肯定会碰到从Solr中反推数据的需求,基于数据库数据生产索引后,那么Solr索引的数据相对准确,在电商需求中经常会碰到菜单.导航分类(比如电脑.PC的话会有 ...

  4. Solr学习总结(六)SolrNet的高级用法(复杂查询,分页,高亮,Facet查询)

    上一篇,讲到了SolrNet的基本用法及CURD,这个算是SolrNet 的入门知识介绍吧,昨天写完之后,有朋友评论说,这些感觉都被写烂了.没错,这些基本的用法,在网上百度,资料肯定一大堆,有一些写的 ...

  5. 再谈Newtonsoft.Json高级用法

    上一篇Newtonsoft.Json高级用法发布以后收到挺多回复的,本篇将分享几点挺有用的知识点和最近项目中用到的一个新点进行说明,做为对上篇文章的补充. 阅读目录 动态改变属性序列化名称 枚举值序列 ...

  6. Newtonsoft.Json高级用法(转)

    手机端应用讲究速度快,体验好.刚好手头上的一个项目服务端接口有性能问题,需要进行优化.在接口多次修改中,实体添加了很多字段用于中间计算或者存储,然后最终用Newtonsoft.Json进行序列化返回数 ...

  7. 【转】 Newtonsoft.Json高级用法

    手机端应用讲究速度快,体验好.刚好手头上的一个项目服务端接口有性能问题,需要进行优化.在接口多次修改中,实体添加了很多字段用于中间计算或者存储,然后最终用Newtonsoft.Json进行序列化返回数 ...

  8. Newtonsoft.Json高级用法 1.忽略某些属性 2.默认值的处理 3.空值的处理 4.支持非公共成员 5.日期处理 6.自定义序列化的字段名称

    手机端应用讲究速度快,体验好.刚好手头上的一个项目服务端接口有性能问题,需要进行优化.在接口多次修改中,实体添加了很多字段用于中间计算或者存储,然后最终用Newtonsoft.Json进行序列化返回数 ...

  9. 细说 ASP.NET Cache 及其高级用法【转】

    阅读目录 开始 Cache的基本用途 Cache的定义 Cache常见用法 Cache类的特点 缓存项的过期时间 缓存项的依赖关系 - 依赖其它缓存项 缓存项的依赖关系 - 文件依赖 缓存项的移除优先 ...

随机推荐

  1. JSP内置对象--application对象(getRealPath(),getAttributeNames(),getContextPath())

    application对象是javax.servlet.ServletContext接口的实例化对象.是整个servlet的上下文,代表了整个web容器的操作. 常用方法: 1.java.lang.S ...

  2. zf-关于业务量统计柱形图(上月份的没显示出来的解决办法)

    首先要想到是存储过程里面除了问题,导致没有显示出来 因为本年度和本季度 是能显示出来的 所以后台代码是没问题的 存储过程里 有个tj_type  这个tj_type有3个值 1 代表本年度 2 代表本 ...

  3. Android--paint应用举例

    android 用paint,canvas 绘图 (1)主要用了paint ,canvas 两个类中的方法 (2)主要用了画线和画圆的方法. (3)drawline(起始点轴坐标,起始点y轴坐标,终点 ...

  4. JAVA实现二进制,十六进制输出

    public class Main { /** * @param args */ public static void main(String[] args) { // TODO Auto-gener ...

  5. iptables-过滤61开头的ip数据包

    iptables -F root@android:/system/bin # iptables -L -n iptables -L -n Chain INPUT (policy ACCEPT) tar ...

  6. FileFilter与FilenameFilter实例

    下面的例子中我们创建了一个FileFilter类,此类根据文件名的扩展名是否为.txt来筛选文件.创建FileFilter实例之后需要将此实例作为参数传给File的listFiles(fileFilt ...

  7. HTML基本

    a标签的四种状态 a:link;  /* 未访问的链接 */ a:visited;  /* 已访问的链接 */ a:hover; /* 当有鼠标悬停在链接上 */ a:hover 必须位于 a:lin ...

  8. lang

    我的docker容器里边,运行我的java进程时环境变量LANG为空导致乱码,重启java进程不为空显示正常:没有地方显式的设置过LANG,没找到/etc/(environment,profile,l ...

  9. Java谜题——类谜题(二)

    1.域的隐藏 代码如下: class Base { public String className = "Base"; } class Derived extends Base { ...

  10. php 依赖注入容器

    原文: http://blog.csdn.net/realghost/article/details/35212285 https://my.oschina.net/cxz001/blog/53316 ...