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. 剑指offer 连续子序列和

    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 class Solution { public:     int FindGreatestSumOfSu ...

  2. JSP标准标签库(JSTL)--国际化标签库 fmt

    JSTL中使用fmt.tld作为格式化标签库的定义文件 No. 功能分类 标签名称 描述 1 国际化标签 <fmt:setLocale> 设置一个全局的地区代码 2 <fmt:req ...

  3. android AsyncTask介绍 转载

    http://www.cnblogs.com/devinzhang/archive/2012/02/13/2350070.html AsyncTask和Handler对比 1 ) AsyncTask实 ...

  4. MDK的优化应用(转)

    源:http://blog.163.com/zhaojun_xf/blog/static/300505802011291384721/ 使用Keil/MDK这么多年了,一直都没有使用它的代码优化功能. ...

  5. android脚步---跟随手指动的小球

    这次的学习主要是在包里面除自动生成的mainactivity.java之外,再新建一个class, DrawView,在mainactivity里面调用DrawView. 在DrawView里面主要是 ...

  6. 对Viewcontroller在UINavigationController中入栈出栈的一点点理解

    转载自:http://blog.csdn.net/intheair100/article/details/41119073 wait_record_arr 在viewdidload里面被alloc,如 ...

  7. FZU Problem 2029 买票问题(树状数组)

    当我看到题目是5秒的时候,压根没有想树状数组,一直奔着模拟队列去想了,最后也没搞定,赛后看到大神的题解才恍然大悟,原来如此,题目中有明显的暗示,求前n项和,骤然感叹,自己太low... 果然还是要多做 ...

  8. docker 1.12 版本 docker swarm 集群

    博客已经迁移到 个人博客中 个人博客 更新地址: http://www.xf80.com/2016/10/25/docker-swarm-1.12/ docker 1.12 版本 的新特性 (1)do ...

  9. 基于I2C EPPRPM(AT24C02B) + LCD12864实验

    本次实验目的:在指定的EPPROM地址中,写入一数据,延时100MS后,在从该地址中读取,并在LCD上显示. 该实验在前两天就开始做了,一开始并没有成功,读出的一直0x00,当时也调了一会,但跳回到P ...

  10. HTML基本

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