谷歌瀏覽器日志記錄命令console.log的使用

Firebug2.0.7 中文最新版

• 類型：瀏覽輔助大小：2.4M語(yǔ)言：中文 評(píng)分：7.2
• 標(biāo)簽：

立即下載

相信從事前端開(kāi)發(fā)的您，一定不會(huì)陌生Mozilla五星級(jí)推薦的一款插件：firebug，它是如此強(qiáng)大，乃至于我們可以很方便地調(diào)試DHTML的近乎所有元素。而在它深邃的機(jī)體里，還存有一個(gè)命令：console.log。 她是用來(lái)做什么的？顧名思義，它是一個(gè)彪悍的日志記錄功能，您可以從您自己的web頁(yè)面上調(diào)用，然后以最快的方式轉(zhuǎn)儲(chǔ)盡可能多的信息到控制臺(tái)上，從而能更醒目地讓你意識(shí)到你的javascript下一步需要做什么。

那么，菜鳥(niǎo)級(jí)前端工程師賢心將與您分享這一可愛(ài)的朋友。 首先請(qǐng)嘗試打開(kāi)你的chrome瀏覽器，F12召喚出firebug，在如下界面中點(diǎn)擊Console，然后輸入13+14，回車(chē)，它將出現(xiàn)：

它就是如此靈活，無(wú)論您是否接受！其最簡(jiǎn)單的書(shū)寫(xiě)方式可以為：

console.log('hello world');

你還可以加入許多參數(shù),比如:

var you = 'you';
console.log(1,3,1,4,'love',you);

在一些遍歷的操作中，如果你需要一眼目睹所有結(jié)果，使用alert調(diào)試顯然不足，那么你就可以借助log：

var json = {
	name:'賢心',
	sex:'男',
	age:'23'
}
for(i in json){
	console.log(i+':'+json[i]);
	//alert(i+':'+json[i])
}

當(dāng)然，console.log提供的功能遠(yuǎn)不止這些，您還可以在它的控制臺(tái)中做更多的事。如果你給log傳遞的是一個(gè)對(duì)象或者數(shù)組、HTML元素等，控制臺(tái)將會(huì)顯示為一個(gè)超鏈接，點(diǎn)擊它您就可以查看該元素的詳細(xì)信息了，比如您可以輸入：

console.log(document.body);

那么，它將立馬輸出body所包含的所有元素：

除了console.log，console對(duì)象還能實(shí)現(xiàn)日志的彩色輸出，這將讓您的調(diào)試結(jié)果顯得更清晰了：

console.warn(); //信息左側(cè)將會(huì)出現(xiàn)感嘆圖標(biāo)
console.error(); //信息左側(cè)將會(huì)出現(xiàn)×圖標(biāo)

熟練使用console.log，可以讓您在javascript調(diào)試中省不少麻煩，尤其是面對(duì)龐大的框架操作。那么，從現(xiàn)在開(kāi)始，趕緊去嘗試運(yùn)用吧，你將體會(huì)她更多的神奇，而不僅僅是賢心所介紹的這些。