console 高级用法

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()

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

转载于:https://www.cnblogs.com/human/p/3475933.html