Chrome开发工具之Console
Chrome开发工具-Console
看了别人的博客,才发现在百度主页用开发工具“Console”可以看到百度的招聘信息

前端调试工具可以按F12打开,谷歌的开发工具中的Console面板可以查看错误信息、打印调试信息、调试js代码,还可以当作Javascript API查看
如果我想查看console都有哪些方法和属性,我可以直接在Console中输入“console”并执行。或者用"console.dir(console)",同样可以实现查看console对象的方法和属性。

console.assert()
有两个参数,当第一个参数执行结果为true时,控制台无法显示,执行结果为false时,输出第二个参数
console.assert(2>1,"true");
console.assert(1>2,"false");
3 //执行结果为:Assertion failed: false
console.count()
打印出这个方法被执行的次数。
function showCount(){
console.count("call");
}
showCount(); // call: 1
showCount(); // call: 2
showCount(); // call: 3
console.time(label);
开始一个新的带有标签的计时器。在之后的代码中调用console.timeEnd(label)时,停止计时并且将所耗时间间打印在控制台。注意:timeEnd的label需要和time的label对应上才算闭合这个计时。
console.time("Array initialize");
var arr = new Array(100),
len = arr.length,
i;
for (i = 0; i < len; i++) {
arr[i] = new Object();
};
console.timeEnd("Array initialize"); //输出Array initialize: 0.588ms
console.log()
可以接受任何字符串、数字和JavaScript对象。与alert()函数类似,console.log()也可以接受换行符\n以及制表符\t。console.log()语句所打印的调试信息可以在浏览器的调试控制台中看到
console.log("inf"); //输出:inf
Chrome开发工具之Console的更多相关文章
- Chrome 开发工具之Console
前段时间看git的相关,记的笔记也大致写到了博客上,还有些因为运用不熟,或者还有一些疑惑点,暂时也不做过多纠缠,之后在实践中多运用得出结论再整理分享吧. 工欲善其事,必先利其器.要想做好前端的工作,也 ...
- Chrome 开发工具之Timeline
之前有说到Element,Console,Sources大多运用于debug,Network可用于debug和查看性能,今天的主角Timeline更多的是用在性能优化方面,它的作用就是记录与分析应用程 ...
- Chrome 开发工具之Sources
Sources面板主要用于查看web站点的资源列表及javascript代码的debug 熟悉面板 了解完面板之后,下面来试试这些功能都是如何使用的. 文件列表 展示当前页面内所引用资源的列表,和平常 ...
- Chrome 开发工具指南
Chrome 开发工具指南 谷歌 Chrome 开发工具,是基于谷歌浏览器内含的一套网页制作和调试工具.开发者工具允许网页开发者深入浏览器和网页应用程序的内部.该工具可以有效地追踪布局问题,设置 Ja ...
- Chrome 开发工具之Timeline/Performance
之前有说到Element,Console,Sources大多运用于debug,Network可用于debug和查看性能,今天的主角Timeline(现已更名Performance)更多的是用在性能优化 ...
- Chrome 开发工具之 Memory
开发过程中难免会遇到内存问题,emmm... 本文主要记录一下Chrome排查内存问题的面板,官网也有,但有些说明和例子跟不上新的版本了,也不够详细... !!! 多图预警!!! 简单的内存 ...
- Chrome开发工具Elements面板(编辑DOM和CSS样式)详解
Element 译为“元素”,Element 面板可以让我们动态查看和编辑DOM节点和CSS样式表,并且立即生效,避免了频繁切换浏览器和编辑器的麻烦. 我们可以使用Element面板来查看源代码,它不 ...
- Chrome 开发工具 Javascript 调试技巧
http://www.w3cplus.com/tools/dev-tips.html 一.Sources 面板介绍: Sources 面板分为左中右 3 部分左:Sources 当前页面加载的资源列表 ...
- Chrome 开发工具 Workspace 使用
前端开发中我们经常要在浏览器中做一些细节调整,比如对 CSS 的微调,最快的方式当然是直接在 Chrome 的开发者工具中调整,但问题在于在控制台中调试好的数值我们还需要再在 CSS 源码中再写一次, ...
随机推荐
- 移动端常用的meta
1. 禁止缩放:<meta name="viewport" content="width=device-width, initial-scale=1.0, maxi ...
- jQuery最基础最全面的选择器大览
一.基本选择器 1.标签选择器 (element):根据给定的标签名匹配元素 eg:$("h2")选取所有h2元素 --- 返回元素集合 2.类选择器 (.class):根 ...
- angular学习之路(一)
angular是什么? angular是一个用于设计动态web应用的结构框架! 它不仅仅是一个JavaScript框架,他的核心其实是对HTML标签的增强. 何为HTML标签的增强?其实就是使用标签完 ...
- 一鼓作气 博客--第三篇 note3
1 推荐读书消费者行为学 -商业的本质,APP得到,5分钟商学院 2定义字典 dic={'name':haibao,'age':18} 3字典的基本操作--查询 dic={'name':'haibao ...
- PHP基础知识之对象复制
对象的复制默认为浅复制 进行深复制的方法为:在类中定义魔法方法__clone(),类的对象复制时,会自动调用 __clone方法,在 __clone方法中可以进行各种复制对象的个性化 class My ...
- GIT的认识
说实话,在听到小伙伴们都说赶紧做作业的时候很茫然,连一点头绪都没有,根本不知道从何入手,但不能因为不会就不去做,于是还是拿起手机,找到小伙伴商量着做着,虽然等的过程很焦急,但还是注册成功了.而开始写对 ...
- HDFS Client 设计实现解析
前面对 HDFS NameNode 和 DataNode 的架构设计实现要点做了介绍,本文对 HDFS 最后一个主要构成组件 Client 做进一步解析. 流式读取 HDFS Client 为客户端应 ...
- 避免Castle Windsor引起的内存泄露
原文地址: http://nexussharp.wordpress.com/2012/04/21/castle-windsor-avoid-memory-leaks-by-learning-the-u ...
- 获取Windows操作系统的CPU使用率以及内存使用率
此功能参考了ProcessHacker项目的代码. 声明定义 typedef struct _UINT64_DELTA { ULONG64 Value; ULONG64 Delta; } UINT64 ...
- 备忘录:hadoop技术一点积累
1.hbase的rowkey是按字典排序的,我看有的资料建议rowkey设计不应该是自增的,应该和这个字典排序相关吧 2.hbase的数据存储是按照region来的,region的设计前段时间在坐飞机 ...