灵活的console

//打印信息。注:%s字符串,%d数字,%c添加css样式
console.log('console.log');
//打印警告
console.warn('console.warn');
//打印dom
console.dir(document.getElementById('a3'));
//打印表格
console.table([{
    id: '1',
    name: '小明',
    age: '18',
    weight: '55kg'
}, {
    id: '1',
    name: '小红',
    age: '17',
    weight: '65kg'
}], ['name', 'age']);
//打印非匹配。应用场景:查找差异、ajax请求数据格式差异提示。
var arr = ['1', '2', {
    id: '3'
}];
arr.forEach(function(item, index) {
    console.assert(typeof item === 'string', item);
});
//打印计数。应用场景:dom绑定事件次数监测
listenerAdd(true);
function listenerAdd(isfirst) {
    !isfirst&&console.countReset('click');
    document.querySelector('#countAdd').addEventListener('click', function() {
        console.count('click');
    });
}
//打印操作时间
getRunTime();
function getRunTime() {
    console.time('t');
    setTimeout(function () {
        console.timeEnd('t');
        console.log('发现没有,时间t大于%c600ms', 'color:red')
    }, 600);
}
//组合打印信息
group();
function group() {
    var res = [];
    console.group('logGroup');
    for (var i = 0, length = 10; i < length; i++) &#123;
        console.log('<li>' + i + '</li>');
    &#125;
    console.groupEnd();
&#125;

参考文档:
灵活使用 console 让 js 调试更简单
示例:请点这里


  转载请注明: XMwarrior 灵活的console

  目录