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的更多相关文章

  1. Chrome 开发工具之Console

    前段时间看git的相关,记的笔记也大致写到了博客上,还有些因为运用不熟,或者还有一些疑惑点,暂时也不做过多纠缠,之后在实践中多运用得出结论再整理分享吧. 工欲善其事,必先利其器.要想做好前端的工作,也 ...

  2. Chrome 开发工具之Timeline

    之前有说到Element,Console,Sources大多运用于debug,Network可用于debug和查看性能,今天的主角Timeline更多的是用在性能优化方面,它的作用就是记录与分析应用程 ...

  3. Chrome 开发工具之Sources

    Sources面板主要用于查看web站点的资源列表及javascript代码的debug 熟悉面板 了解完面板之后,下面来试试这些功能都是如何使用的. 文件列表 展示当前页面内所引用资源的列表,和平常 ...

  4. Chrome 开发工具指南

    Chrome 开发工具指南 谷歌 Chrome 开发工具,是基于谷歌浏览器内含的一套网页制作和调试工具.开发者工具允许网页开发者深入浏览器和网页应用程序的内部.该工具可以有效地追踪布局问题,设置 Ja ...

  5. Chrome 开发工具之Timeline/Performance

    之前有说到Element,Console,Sources大多运用于debug,Network可用于debug和查看性能,今天的主角Timeline(现已更名Performance)更多的是用在性能优化 ...

  6. Chrome 开发工具之 Memory

    开发过程中难免会遇到内存问题,emmm... 本文主要记录一下Chrome排查内存问题的面板,官网也有,但有些说明和例子跟不上新的版本了,也不够详细...   !!! 多图预警!!!    简单的内存 ...

  7. Chrome开发工具Elements面板(编辑DOM和CSS样式)详解

    Element 译为“元素”,Element 面板可以让我们动态查看和编辑DOM节点和CSS样式表,并且立即生效,避免了频繁切换浏览器和编辑器的麻烦. 我们可以使用Element面板来查看源代码,它不 ...

  8. Chrome 开发工具 Javascript 调试技巧

    http://www.w3cplus.com/tools/dev-tips.html 一.Sources 面板介绍: Sources 面板分为左中右 3 部分左:Sources 当前页面加载的资源列表 ...

  9. Chrome 开发工具 Workspace 使用

    前端开发中我们经常要在浏览器中做一些细节调整,比如对 CSS 的微调,最快的方式当然是直接在 Chrome 的开发者工具中调整,但问题在于在控制台中调试好的数值我们还需要再在 CSS 源码中再写一次, ...

随机推荐

  1. React-native之持久化保存----AsyncStorage

    AsyncStorage AsyncStorage是一个简单的,未加密的,异步的,持久化,关键值存储系统,是全局的. iOS中存储类似于NSUserDefault,存储问plist文件存放在设备中. ...

  2. 初识linux

    1.版本 稳定版本:偶数版如2.6.X 发展中的版本:奇数版如2.5.X linux distribution包含:linux kernel + free software + documentati ...

  3. Zybo GPIO Demo Run Embedded Linux

    1.Environment Ubuntu 12.04 x86_64 Vivado 2013.4 SDK 2013.4   2.Pre-requisites 2.1 CodeSourcery arm-g ...

  4. UCenter 基本原理一瞥

    UCenter 是国内最常用的会员整合系统,它定义了一套接口用于不同应用(系统)间的协作. 注册过程 通过某个应用注册时,应用会先调用 uc_client/client.php 中的 uc_user_ ...

  5. 事务使用中如何避免误用分布式事务(System.Transactions.TransactionScope)

    1:本地事务DbTransaction和分布式事务TransactionScope的区别: 1.1:System.Data.Common.DbTransaction: 本地事务:这个没什么好说了,就是 ...

  6. iOS开发系列--Objective-C之类和对象

    概述 前面已经简单介绍过ObjC的基础知识,让大家对ObjC有个大致的印象,今天将重点解释ObjC面向对象的特性.ObjC相对于C语言多了面向对象特性,但是ObjC又没有其他面向对象语言那么多语法特性 ...

  7. 人人都是 DBA(XII)查询信息收集脚本汇编

    什么?有个 SQL 执行了 8 秒! 哪里出了问题?臣妾不知道啊,得找 DBA 啊. DBA 人呢?离职了!!擦!!! 程序员在无处寻求帮助时,就得想办法自救,努力让自己变成 "伪 DBA& ...

  8. C#设计模式之职责链

    Iron之职责链 需求: "Iron"的建造一直没有停止,现在单个部件是有的,但是在部件从工厂里出来的时候,在组装到一起之前,我们还是非常有必要对部件进行质量检测,或者是其它个方面 ...

  9. JAVA spring hibernate 多数据源配置记录

    数据源配置 <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http:// ...

  10. How To Install Proxmox Nested on VMware ESXi (Full Support OpenVZ & KVM)

    https://imanudin.net/2015/03/04/how-to-install-proxmox-nested-on-vmware-esxi-full-support-openvz-kvm ...