1.console.log() 占位符

console.log 支持的占位符包括:字符(%s)、整数(%d或%i)、浮点数(%f)和对象(%o):

console.log('字符串: %s, 整数: %d, 浮点数: %f, 对象: %o', '哈哈哈', 666, 6.66, {name: 'cedric'}); // 字符串: 哈哈哈, 整数: 666, 浮点数: 6.66, 对象: {name: "cedric"}

2.console.log() 添加 css 样式

console.log('%c这句话含css样式', 'color: #fff; background-color: #6666ff; padding: 8px 16px; border-radius: 6px');

3.显示不同信息

console.log('正常'); 

console.info('信息');

console.error('错误');

console.warn('警告');

4. console.dir()

打印对象,不常用

5. console.table()

打印表格

6. 分组显示

console.group("第一组");
console.log("第一组第一条");
console.log("第一组第二条");
console.groupEnd();
  
console.group("第二组信息");
console.log("第二组第一条");
console.log("第二组第二条");
console.groupEnd();

7. console.trace() 追踪函数的调用轨迹。

foo();

function foo() {
function bar() {
console.trace();
}
bar();
}

打印结果:

8. console.time()和console.timeEnd() 显示代码运行时间

console.time("代码运行时间");

  for(var i=0;i<100000;i++){ }
console.timeEnd("代码运行时间");

打印结果:

代码运行时间: 3.316162109375ms

console 命令进行 JS 调试的灵活用法的更多相关文章

  1. 【转载】你不知道的 console,让 JS 调试更简单

    对于前端工程师,肯定不会对console陌生,但是,又能深入了解多少呢? Chrome控制台-开发者工具 windows按F12, MAC按Command + Option + C或Command + ...

  2. 灵活使用 console 让 js 调试更简单

    摘要: 玩转console. 原文:灵活使用 console 让 js 调试更简单 作者:前端小智 Fundebug经授权转载,版权归原作者所有. Web 开发最常用的就是 console.log , ...

  3. [转]九个Console命令,让js调试更简单

    转自:九个Console命令,让js调试更简单 一.显示信息的命令 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <!DOCTYPE html> <html ...

  4. 【F12】Console命令,让js调试更简单

    Console命令,让js调试更简单 一.显示信息的命令 console.log("normal"); // 用于输出普通信息 console.info("informa ...

  5. 九个console命令调试JS

    下面九个console命令,可以帮助我们更方便地调试 常用的console命令,最常用的事console.log() 1 //常用的console命令,其中最常用的console.log() 2 co ...

  6. 【F12】九个Console命令,让js调试更简单

    一.显示信息的命令 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <!DOCTYPE html> <html> <head>     &l ...

  7. 九个Console命令,让 JS 调试更简单

    一.显示信息的命令 <!DOCTYPE html> <html> <head> <title>常用console命令</title> < ...

  8. vue—你必须知道的 js数据类型 前端学习 CSS 居中 事件委托和this 让js调试更简单—console AMD && CMD 模式识别课程笔记(一) web攻击 web安全之XSS JSONP && CORS css 定位 react小结

    vue—你必须知道的   目录 更多总结 猛戳这里 属性与方法 语法 计算属性 特殊属性 vue 样式绑定 vue事件处理器 表单控件绑定 父子组件通信 过渡效果 vue经验总结 javascript ...

  9. 让js调试更简单—console

    一.显示信息的命令 console.log 用于输出普通信息 console.info 用于输出提示性信息 console.error用于输出错误信息 console.warn用于输出警示信息 最常用 ...

随机推荐

  1. Python高级特性:列表生成式

    列表生成式即List Comprehensions,是Python内置的非常简单却强大的可以用来创建list的生成式. 最常见的例子: 生成list [, , , , , , , , , ]可以用li ...

  2. OpenCV 4.0.1 找不到R.styleable解决

    OpenCV 4.0.1作为模块导入Android Studio会有找不到R.styleable的问题. 解决方法 1.导入模块前 将 opencv-4.0.1-android-sdk\OpenCV- ...

  3. java中的数据类型,运算符,字符串,输入输出,控制流,大数值,数组; 《java核心技术卷i》 第三章:java基本程序结构;

    <java核心技术卷i> 第三章:java基本程序结构: 每次看书,去总结的时候,总会发现一些新的东西,这次对于java的数组有了更深的了解: java中的数据类型,运算符,字符串,输入输 ...

  4. ubuntu 安装PG10 更新packet 创建超级账号

    ubuntu 安装PG10 更新packet 创建超级账号 安装pg10 我的环境是16.04 server版本 MAC和windows 建议使用安装包 直接官网下载 echo 'deb http:/ ...

  5. weblogic系列漏洞整理 -- 5. weblogic SSRF 漏洞 UDDI Explorer对外开放 (CVE-2014-4210)

    目录 五. weblogic SSRF 漏洞 UDDI Explorer对外开放 (CVE-2014-4210) 1. 利用过程 2. 修复建议 一.weblogic安装 http://www.cnb ...

  6. SQL Server 2005 sp_send_dbmail出现Internal error at FormatRowset (Reason: Not enough storage is available to complete this operation)

    案例环境: 操作系统: Windows 2003 SE 32bit(SP2) 数据库版本:Microsoft SQL Server 2005 - 9.00.5069.00 (Intel X86) Au ...

  7. 洗礼灵魂,修炼python(65)--爬虫篇—BeautifulSoup:“忘掉正则表达式吧,我拉车养你”

    前面解析了正则表达式,其实内容还挺多的对吧?确实挺适用的,不仅是python,其他语言或者web前端后端基本都要掌握正则表达式知识,但是你说,这么多,要完全的掌握,灵活运用的话,得搞多久啊?并且如果一 ...

  8. Linux Rsyslog日志集中管理

    Linux Rsyslog日志集中管理 一.Rsyslog简介 ryslog 是一个快速处理收集系统日志的程序,提供了高性能.安全功能和模块化设计.rsyslog 是syslog 的升级版,它将多种来 ...

  9. Python面试题(二)【转】

    转载出处http://www.cnblogs.com/goodhacker/p/3387027.html 1.python中类方法.类实例方法.静态方法有何区别? 区别: 类方法和静态方法都可以被类和 ...

  10. Linux 小知识翻译 - 「邮件服务器」

    这次聊聊「邮件服务器」. 邮件服务器上通常会运行2个服务端软件,「SMTP服务器」和「POP服务器或者IMAP服务器」. 这2个东西,也许使用邮件客户端的人立马就明白了.因为设置邮件客户端的时候,需要 ...