实用的 Chrome Developers Tools

时间:2023-03-10 05:29:08
实用的 Chrome Developers Tools

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

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

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

比如给hello world 做件漂亮的嫁衣再拉出来见人:
实用的 Chrome Developers Tools
除此,console.table 更是直接以表格的形式将数据输出
实用的 Chrome Developers Tools

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

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

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

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