firebug工具使用(下) 

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script>
    var cat = {};
        cat.name = "咪咪";
        cat.color = "白色";
        cat.show = function(){
            return "喵~！"
        };
       console.info(cat);
    </script>
</head>
<body>

</body>
</html>

会弹出对象的信息（name,color等），但是不完全这个时候值需要点击DOM按钮就可以看到cat的具体信息、还可以使用console.dir就可以显示出所有的信息

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script>
        window.onload = function(){
            var divO = document.getElementById("div1");
            console.dirxml(divO);
        }
    </script>
</head>
<body>
    <div id="div1">testone</div>
</body>
</html>

会显示当前元素的代码结构

常用的函数语句

console.assert

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script>
        var a = 0;
        console.assert(a);
    </script>
</head>
<body>
</body>
</html>

console.assert方法用于对一个表达式的执行结果进行评估，如果该表达式的执行结果为false，则输出一个消息字符串并抛出AssertionError异常。

console.trace():在控制台打印该处的函数调用栈信息

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script>
        function a(){
            return b();
        }
        function b(){
            return c()
        }
        function c(){
            console.trace();
            return 1;
        }
        a();
    </script>
</head>
<body>
</body>
</html>

按照执行顺序依次打印 c() b() a(),能够清楚的知道当前函数的执行过程

console.time()：打印当前代码的运行时间

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script>
        console.time('计时器');
        for(var i= 0 ; i<1000000; i++){
        }
        console.timeEnd('计时器');
    </script>
</head>
<body>
</body>
</html>

输出当前页面的运行时间，有利于网页的优化

　

posted @ 2015-11-08 23:20  无名氏G  阅读(135)  评论(0)  编辑  收藏  举报