一、顯示信息的命令
console.log("normal"); // 用于輸出普通信息console.info("information"); // 用于輸出提示性信息console.error("error"); // 用于輸出錯誤信息console.warn("warn"); // 用于輸出警示信息
二、點位符：字符(%s)、整數(shù)(%d或%i)、浮點數(shù)(%f)和對象(%o);
console.log("%s","string"); //字符(%s)console.log("%d年%d月%d日",2016,8,29); //整數(shù)(%d或%i)console.log("圓周率是%f",3.1415926); //浮點數(shù)(%f)var dog = {};dog.name = "大毛";dog.color = "黃色";dog.sex = "母狗";console.log("%o",dog); //對象(%o)
三、信息分組 (console.group(),console.groupEnd())
console.group("第一組信息"); console.log("第一組第一條：我的博客"); console.log("第一組第二條：CSDN");console.groupEnd();console.group("第二組信息"); console.log("第二組第一條：程序愛好者QQ群"); console.log("第二組第二條：歡迎你加入");console.groupEnd();
四、將對象以樹狀結(jié)構(gòu)展現(xiàn) (console.dir()可以顯示一個對象所有的屬性和方法)
var info = { name : "Alan", age : "27", grilFriend : "nothing", getName : function(){ return this.name; }}console.dir(info);
五、顯示某個節(jié)點的內(nèi)容 (console.dirxml()用來顯示網(wǎng)頁的某個節(jié)點(node)所包含的html/xml代碼)
var node = document.getElementById("info");node.innerHTML += "<p>追加的元素顯示嗎</p>";console.dirxml(node);
六、判斷變量是否是真 (console.assert()用來判斷一個表達式或變量是否為真，只有表達式為false時，才輸出一條相應(yīng)作息，并且拋出一個異常)
var testObj = false;console.assert(testObj, '當testObj為false時才輸出！');
七、計時功能 (console.time()和console.timeEnd()，用來顯示代碼的運行時間)
console.time("控制臺計時器");for(var i = 0; i < 10000; i++){ for(var j = 0; j < 10000; j++){} }console.timeEnd("控制臺計時器");
八、性能分析performance profile (就是分析程序各個部分的運行時間，找出瓶頸所在，使用的方法是console.profile()和console.proileEnd();)
function All(){ // alert(11); for(var i = 0; i < 10; i++){ funcA(100); } funcB(1000);}function funcA(count){ for(var i = 0; i < count; i++){};}function funcB(count){ for(var i = 0; i < count; i++){};}console.profile("性能分析器");All();console.profileEnd();
詳細的信息在chrome控制臺里的"profile"選項里查看
九、console.count()統(tǒng)計代碼被執(zhí)行的次數(shù)
function myFunction(){ console.count("myFunction 被執(zhí)行的次數(shù)");}myFunction(); //myFunction 被執(zhí)行的次數(shù): 1myFunction(); //myFunction 被執(zhí)行的次數(shù): 2myFunction(); //myFunction 被執(zhí)行的次數(shù): 3
十、keys和values，要在瀏覽器里輸入
十一、console.table表格顯示方法
var mytable = [ { name: "Alan", sex : "man", age : "27" }, { name: "Wu", sex : "gril", age : "28" }, { name: "Tao", sex : "man and gril", age : "29" }]console.table(mytable);
十二、Chrome 控制臺中原生支持類jQuery的選擇器，也就是說你可以用$加上熟悉的css選擇器來選擇DOM節(jié)。
$("body"); //選擇body節(jié)點
十三、copy通過此命令可以將在控制臺獲取到的內(nèi)容復制到剪貼板
copy(document.body); //復制bodycopy(document.getElementById("info")); //復制某id元素的的節(jié)點
十四、$_命令返回最近一次表達式執(zhí)行的結(jié)果，$0-$4代表了最近5個你選擇過的DOM節(jié)點
十五、利用控制臺輸出文字,圖片,以%c開頭，后面的文字就打印的信息，后面一個參數(shù)就是樣式屬性；
console.log("請在郵件中注明%c 來自:console","font-size:16px;color:red;font-weight:bold;");
