在前端調試js代碼的時候，很多人都喜歡用 alert() 來進行調試，但是 alert() 會阻斷JS的運作，而且對一些類型的變量無法輸出，這就造成了不少的麻煩。針對這個問題，這篇文章就說一說js中的别一種調試方法 console.log()
console.log()定義
console.log()：可以将變量輸出到浏覽器的控制台中，友善開發者調用JS代碼，它是一個使用頻率很高的功能。
提示：浏覽器中按 F12 可以打開浏覽器的控制台(也可以叫做開發者工具)
文法：
console.log(var); 複制
參數：
var：變量，可以是數組類型，對象類型，或者字元串類型等
console.log()用法
1、console.log()列印字元串
<script>
var str = 'feiniaomy.com';
console.log(str);
var str2 = '飛鳥慕魚部落格';
console.log(str2);
</script> 列印結果：
2、console.log()列印數組
<script>
var arr = new Array('beijing','shandong','hangzhou','guangdong');
console.log(arr);
</script> 
3、console.log列印一個對象變量
<script>
var obj = { Host: "http://www.feiniaomy.com", Name: "飛鳥慕魚部落格"};
console.log(obj);
</script> console.log()進階用法
console.log()可以通過一些特有的占位符進行資訊的加工輸出，當然你隻要粗略的了解一下即可
console.log()用到的占位符号
%s：字元串
%d：整數
%i：整數
%f：浮點數
%o：obj對象
%O：obj對象
%c：CSS樣式
例：利用console.log()列印出對象和DOM節點，
1、列印一個DOM節點，差別占位符 %o 與 %O不同
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="mochu">飛鳥慕魚部落格<br/>http://www.feiniaomy.com</div>
<script>
console.log(document.body);
console.log('%o',document.body);
console.log('%O', document.body);
</script>
</body>
</html> 2、列印一個obj對象，差別占位符 %o 與 %O不同
<script>
var obj = {'name':'MOCHU','age':'22','page':'http://www.feiniaomy.com'};
console.log(obj);
console.log(obj);
console.log(obj);
</script> 注意：
1、%o、%O都是用來輸出Obj對象的
2、%o、%O在列印普通對象時，是沒有差別的
3、%o、%O在列印DOM節點時，差別是很大的
例：利用console.log()列印整數，
1、使用%d占位符，并進行計算
<script>
console.log('%d + %d =' ,1,2,3);
</script> 2、使用%i占位符并進行計算
<script>
console.log('%i + %i =' ,1,2,3);
</script> 例：利用console.log()列印帶有樣式的文字
<script>
console.log('飛鳥%c慕魚%c部落格' ,'color:red','color:blue');
</script>