做前端的,都喜欢 chrome , 里面的开发工具也很实用,网上看到文章不错,部分摘来分享

-------------------------------

console.log,中包含一些格式化的指令比如%c。

比如给hello world 做件漂亮的嫁衣再拉出来见人:

除此,console.table 更是直接以表格的形式将数据输出

---------------------

console.time & console.timeEnd

当做一些性能测试时,同样可以在这里很方便地进行。
比如需要考量一段代码执行的耗时情况时,可以用console.time与 console.timeEnd来做此事。

这里借用官方文档的例子:

1
2
3
4
5
6
console.time("Array initialize");
var array= new Array(1000000);
for (var i = array.length - 1; i >= 0; i--) {
array[i] = new Object();
};
console.timeEnd("Array initialize");

------------------------

Chrome Developers Tools基础篇  转自:http://xgfe.github.io/2016/05/16/scliuyang/ChromeDevTools1/

实用的 Chrome Developers Tools的更多相关文章

  1. Chrome Dev Tools :成为更高效的开发人员

    原文出处 http://blog.jobbole.com/22065/ 实时CSS Style编辑 选择一个Dom,可以对Dom进行编辑和操作,实时修改Css Style, 同时CssStyle可以保 ...

  2. Chrome Developer Tools:Network Panel说明

    官方资料:Chrome Developer Tools: Network Panel 一.chrome Developer Tools:Network Panel 从网络面板中可以获取很多有用信息,如 ...

  3. chrome dev tools

    chrome dev tools介绍一下Chrome dev tools 的基本使用和一些意想不到的小技巧.\\Chrome Developer Tools 是Chrome内嵌的一系列编辑和调试的工具 ...

  4. Web前端开发实用的Chrome插件

    Web前端开发实用的Chrome插件 越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率.尤其Chrome本身是可以登录的,登录 ...

  5. 掌握Chrome Developer Tools:下一阶段前端开发技术

    Tips 原文作者:Ben Edelstein 原文地址:Mastering Chrome Developer Tools: Next Level Front-End Development Tech ...

  6. Chrome的开发者工具(Chrome Developer Tools)

    Chrome的开发者工具(Chrome Developer Tools) 按F12 https://developer.chrome.com/devtools/index http://www.w3s ...

  7. Chrome development tools学习笔记(5)

    调试JavaScript 随着如今JavaScript应用的越来越广泛,在面对前端工作的时候,开发人员须要强大的调试工具来高速有效地解决这个问题.我们文章的主角,Chrome DevTools就提供了 ...

  8. Enabling Chrome Developer Tools inside Postman

    Chrome's Developer Tools are an indispensable part of the modern web development workflow. However, ...

  9. Chrome Developer Tools 中的 Preview 不显示 HTML 的问题

    Chrome Developer Tools 中的 Preview 不显示 HTML 的问题 最近升级到 Chrome V64,发现 Chrome Developer Tools 中的 Preview ...

随机推荐

  1. [Re:从零开始的分布式] 0.x——分布式基础概念

    分布式的特点 1. 分布式 2. 对等性 3. 并发性 4. 缺乏全局时钟 5. 故障总是会发生 分布式环境的问题 1. 网络不可靠 2. 网络分区 3. 节点故障 CAP理论 一致性 可用性 分区容 ...

  2. Zynq-7000 FreeRTOS(二)中断:Timer中断

    总结Zynq-7000 这款器件中的Timer定时器中断,为FreeRTOS中断做准备.在 ZYNQ 的纯 PS 里实现私有定时器中断. 每隔一秒中断一次, 在中断函数里计数加 1, 通过串口打印输出 ...

  3. Iviews视频搜索引擎

    随着视频类型的增加和数据量的日益庞大,如何有效地组织和管理这些数据,使人们能够方便地从大量视频数据中找到自己感兴趣的相关视频片段已成为一种迫切的需求,而能够满足这一需求的技术便是目前人们普遍关注的基于 ...

  4. (转)ELK原理与介绍

    原文:https://www.cnblogs.com/aresxin/p/8035137.html 为什么用到ELK: 一般我们需要进行日志分析场景:直接在日志文件中 grep.awk 就可以获得自己 ...

  5. springboot: mybatis的使用

    第一步:引入mybatis依赖 <dependency> <groupId>org.mybatis.spring.boot</groupId> <artifa ...

  6. win7下安装centos6.5后,开机无法进入选择双系统启动界面,只能启动centos的解决办法

    1.centos6.5下打开终端,进入/boot/grub ,vim grub.conf 将default=0 改为1,重启 2.重启后,又只能进入win7了.这个好解决.下载一个easyBCD,具体 ...

  7. grub2配置关键(三个核心变量prefix、root、cmdpath)和几点疑问

    前置知识:你必须知道grub的启动过程以及bios和uefi的相关基础知识,可以参考:<Unified Extensible Firmware Interface Wikipedia>.& ...

  8. nginx 反向代理https

    nginx 反向代理https   原来我用vertx创建了一个https apiserver,想着用nginx反向代理一下.证书是阿里云上免费一年的. 后来发现nginx要反向代理https自己也必 ...

  9. 使用 pjax 实现无刷新切换页面

    一.目的 1.当打开链接的时候,页面是淡入显示,并且页面顶部会显示加载进度条,页面显示完成时,进度条加载满并且消失. 2.点击页面上的 a 标签时,显示加载进度条,并且当前页面淡出消失,当前页面淡出消 ...

  10. TypeScript 乱糟笔记

    数组头上插一个值. var arr: Array<String> = ['a', 'b', 'c'];arr.unshift('d'); object删除元素. var obj: Obje ...