资料整理自网络
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>常用console命令</title> </head> <body> <div id="box"> <ul> <li></li> <li></li> </ul> </div> <script> /* * 基本的格式: */ console.log("hello"); console.info("信息"); console.error("错误"); console.warn("警告"); /* * console支持printf的占位符格式: * 字符(%s) 整数(%d或%i) * 浮点数(%f)和对象 (%o) */ console.log("%d年%d月%d日",2011,3,25) /* * 信息分组 * console.groupCollapsed() 同 console.group(); 区别在于嵌套块默认是收起的。 */ console.group("第一组信息"); console.log("第一组第一条信息") console.log("第一组第一二条信息") console.groupEnd(); console.group("第二组信息"); console.log("第二组第一条信息") console.log("第二组第一二条信息") console.groupEnd(); //还可以嵌套分组 console.group("第一组信息"); console.log("第一组第一条信息") console.log("第一组第一二条信息") console.group("第二组信息"); console.log("第二组第一条信息") console.log("第二组第一二条信息") console.groupEnd(); console.groupEnd(); //闭合表示这个组结束了,否则下面的代码全在这个小组中 /* * 显示一个对象的所有属性和方法 * console.dir() */ var info = { name:"张丹", age:20, run:function(){ alert("running"); } } console.dir(info); /* * 显示页面节点的html代码 */ var box = document.getElementById("box") console.dirxml(box) /* * 判断变量是否为真 * 为真没有任何输出 * 如果结果为否,则在控制台输出一条相应信息,并且抛出一个异常。 */ var res = 1; console.assert(res); /*console.trace() * 追踪函数的调用轨迹 * 对这个的支持好像下降了,只显示出来函数名字 */ function add(a,b){ console.trace(); return a+b; } var x = add3(1,1); function add3(a,b){return add2(a,b)} function add2(a,b){return add1(a,b)} function add1(a,b){return add(a,b)} /* * 计时功能 * console.time()和console.timeEnd(); * 显示代码运行时间。这两个的参数必须一致。 */ console.time("控制台计时---") for(var i = 0;i<1000;i++){ for(var j=0;j<1000;j++){} } console.timeEnd("控制台计时---"); /*性能分析 * console.profile() * 分析程序各个部分的运行时间,找出瓶颈所在, * 使用的方法是console.profile(); */ function All(){ // alert(11); for(var i=0;i<10;i++){ funcA(1000); } funcB(10000); } 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(); //这个好像没什么用,因为谷歌的profile中已经有了。 //除非测某段代码。 参数是表名。 /*输出该行代码被执行的次数 * console.count("次数") */ for(var i=0;i<20;i++){ console.count("循环执行的次数") } /* * console.clear()清空控制台 */ // console.clear(); /* * keys和values 前者返回传入对象所有属性名组成的数据,后者返回所有属性值组成的数组。 * 只在控制台有效,代码里无效。 */ /* * 用表格的形式显示json数据。 */ var arr = [{name:"张丹",age:20},{name:"王大锤",sex:"male"}]; console.table(arr); /* * chrome控制台支持jquery选择器。 * $0 在 HTML 面板中选中的元素。 $1 上一次在 HTML 面板中选中的元素。 */ //暂时先这些。 </script> </body> </html>