快速尋找DOM元素

DOM elements

以表格的形式顯示數(shù)據(jù)對象

var animals = [
 { animal: 'Horse', name: 'Henry', age: 43 },
 { animal: 'Dog', name: 'Fred', age: 13 },
 { animal: 'Cat', name: 'Frodo', age: 18 }
];
console.table(animals);

將輸出......

Console.table

得到一個函數(shù)的堆棧軌跡（某個時間的調(diào)用堆棧狀態(tài)）

var car;
var func1 = function(){
    func2();        
}
 
var func2 = function(){
    func4();
}
 
var func3 = function(){
    
}
 
var func4 = function(){
    car = new Car();
    car.funcX();
}
 
var Car = function(){
    this.brand = 'volvo';
    this.color = 'red';

    this.funcX = function(){
        this.funcY();
    }
 
    this.funcY = function(){
        this.funcZ();
    }
 
    this.funcZ = function(){
        console.trace('trace car')
    }
}
func1();

將輸出......

CONSOLE TRACE

在復(fù)雜的調(diào)試中發(fā)現(xiàn)重要信息

console.todo = function( msg){
    console.log( '%c %s %s %s ', 'color: yellow; background-color: black;', '--', msg, '--');
}
console.important = function( msg){
    console.log( '%c%s %s %s', 'color: brown; font-weight: bold; text-decoration: underline;', '--', msg, '--');
}
console.todo("This is something that's need to be fixed");
console.important('This is an important message');

在上述代碼中 %s 應(yīng)用于字符串, %i 應(yīng)用于整型 %c 應(yīng)用于CSS樣式.
將輸出......

Custom console message