菜单

循序渐进

    Java Oracle MySQL Bash Python Nginx Apache Redis MongoDB Git HTML Javascript Node CSS

最近来访

    Chrome DevTools之Console

    张嘉杰.原创 2013-01-03 browser

    Chrome DevTools已经强大到没有朋友的地步了。适时的运用它,可以有效的提高开发效率,让BUG无处遁形。先说说console的具体用法吧。

    console.log
    # 输出普通信息
    console.log("log...");
    # 输出提示信息
    console.info("info...");
    # 输出警示信息
    console.warn("warn...");
    # 输出错误信息
    console.error("error...");

    console-log

    console.group & console.groupEnd
    # 分组输出
    console.group("core.dom");
    console.log("core.dom begin...");
    console.log("core.dom end...");
    console.groupEnd();
    console.group("core.init");
    console.log("core.init...");
    console.groupEnd();

    console-group-groupEnd

    console.assert
    console.assert(1==="1",'1==="1",条件不成立...');

    console-assert

    console.table
    # 表格输出
    console.table([{'用户': '测试用户1', '访问': 74}, {'用户': '测试用户2', '访问': 90}]);

    console-table

    console.count
    # 执行次数
    function test(){ console.count('test函数被执行的次数:'); }
    test();test();test();test();

    console-count

    console.dir | console.dirxml
    # 节点输出
    console.dir(document.body);
    console.dirxml(document.body);

    console-dir-dirxml

    console.time & console.timeEnd
    # 执行时间
    console.time("执行时间");
    var arr = new Array(10000);
    for (var i = arr.length; i > 0; i--) {}
    console.timeEnd("执行时间");

    console-time-timeEnd

    不清楚Chrome DevTools 是什么的朋友,先来上个课,Chrome DevTools School

    ###好了今天先到这里了 :)


    相关参考文章地址:

    chrome-devTools-school - http://discover-devtools.codeschool.com/
    console-api - https://developer.chrome.com/devtools/docs/console-api/
    commandline-api - https://developer.chrome.com/devtools/docs/commandline-api/


    版权属于:jcore.cn

    原文地址:http://www.jcore.cn/2013/01/03/browser-chrome-console

    除非注明,文章均为原创,转载时必须以链接形式注明原始出处。

    分享文章到:

    热门推荐文章