简单的浏览器调试——console命令

一、显示信息

<script type="text/javascript">
        console.log('hello');
        console.info('信息');
        console.error('错误');
        console.warn('警告');
</script>

二、占位符

  <script type="text/javascript">
            console.log("%d年%d月%d日",2016,11,12);
    </script>

三、信息分组

<script type="text/javascript">
            console.group("我是第一组");
  
       　　　　console.log("111");
 
       　　console.groupEnd();
  
   　　    console.group("我是第二组");
  
       　　　　console.log("222");

   　　    console.groupEnd();
       </script>

四、查看对象信息

 <script type="text/javascript">
            var obj = {
                name:"张三",
                group:001,
                course:"计算机"
            };
            console.dir(obj);
    </script>

五、显示节点内容(包括html/xml)

    <div id="obj">
           <p>www.baidu.com</p>
      </div>
    <script type="text/javascript">
           var info = document.getElementById('obj');
           console.dirxml(obj);
    </script>

六、判断变量是否为真

  <script type="text/javascript">
        　　var result = 0;
        　　console.assert( result );
        　　var year = 2016;
        　　console.assert(year == 2018 );
    </script>

七、追踪函数的调用轨迹

<script type="text/javascript">
    　　function foo(a,b){
            console.trace();
    　　　　return a+b;
    　　}
    　　var x = foo3(1,1);
    　　function foo3(a,b){return foo2(a,b);}
    　　function foo2(a,b){return foo1(a,b);}
   　　function foo1(a,b){return foo(a,b);}
   </script>

八、计时功能

<script type="text/javascript">
    　　console.time("计时器01");
    　　for(var i=0;i<999;i++){
    　　　　for(var j=0;j<999;j++){}
    　　}
    　　console.timeEnd("计时器01");
  </script>

九、程序性能分析

 <script type="text/javascript">
        　　function getAll(){
                alert("hello");
    　　　　     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('性能分析');
       　　getAll();
       　　console.profileEnd();
       </script>

浏览器调试新技能，学习之余写到这里备忘~