console 命令进行 JS 调试的灵活用法
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 调试的灵活用法的更多相关文章
- 【转载】你不知道的 console,让 JS 调试更简单
对于前端工程师,肯定不会对console陌生,但是,又能深入了解多少呢? Chrome控制台-开发者工具 windows按F12, MAC按Command + Option + C或Command + ...
- 灵活使用 console 让 js 调试更简单
摘要: 玩转console. 原文:灵活使用 console 让 js 调试更简单 作者:前端小智 Fundebug经授权转载,版权归原作者所有. Web 开发最常用的就是 console.log , ...
- [转]九个Console命令,让js调试更简单
转自:九个Console命令,让js调试更简单 一.显示信息的命令 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <!DOCTYPE html> <html ...
- 【F12】Console命令,让js调试更简单
Console命令,让js调试更简单 一.显示信息的命令 console.log("normal"); // 用于输出普通信息 console.info("informa ...
- 九个console命令调试JS
下面九个console命令,可以帮助我们更方便地调试 常用的console命令,最常用的事console.log() 1 //常用的console命令,其中最常用的console.log() 2 co ...
- 【F12】九个Console命令,让js调试更简单
一.显示信息的命令 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <!DOCTYPE html> <html> <head> &l ...
- 九个Console命令,让 JS 调试更简单
一.显示信息的命令 <!DOCTYPE html> <html> <head> <title>常用console命令</title> < ...
- vue—你必须知道的 js数据类型 前端学习 CSS 居中 事件委托和this 让js调试更简单—console AMD && CMD 模式识别课程笔记(一) web攻击 web安全之XSS JSONP && CORS css 定位 react小结
vue—你必须知道的 目录 更多总结 猛戳这里 属性与方法 语法 计算属性 特殊属性 vue 样式绑定 vue事件处理器 表单控件绑定 父子组件通信 过渡效果 vue经验总结 javascript ...
- 让js调试更简单—console
一.显示信息的命令 console.log 用于输出普通信息 console.info 用于输出提示性信息 console.error用于输出错误信息 console.warn用于输出警示信息 最常用 ...
随机推荐
- Python高级特性:列表生成式
列表生成式即List Comprehensions,是Python内置的非常简单却强大的可以用来创建list的生成式. 最常见的例子: 生成list [, , , , , , , , , ]可以用li ...
- OpenCV 4.0.1 找不到R.styleable解决
OpenCV 4.0.1作为模块导入Android Studio会有找不到R.styleable的问题. 解决方法 1.导入模块前 将 opencv-4.0.1-android-sdk\OpenCV- ...
- java中的数据类型,运算符,字符串,输入输出,控制流,大数值,数组; 《java核心技术卷i》 第三章:java基本程序结构;
<java核心技术卷i> 第三章:java基本程序结构: 每次看书,去总结的时候,总会发现一些新的东西,这次对于java的数组有了更深的了解: java中的数据类型,运算符,字符串,输入输 ...
- ubuntu 安装PG10 更新packet 创建超级账号
ubuntu 安装PG10 更新packet 创建超级账号 安装pg10 我的环境是16.04 server版本 MAC和windows 建议使用安装包 直接官网下载 echo 'deb http:/ ...
- weblogic系列漏洞整理 -- 5. weblogic SSRF 漏洞 UDDI Explorer对外开放 (CVE-2014-4210)
目录 五. weblogic SSRF 漏洞 UDDI Explorer对外开放 (CVE-2014-4210) 1. 利用过程 2. 修复建议 一.weblogic安装 http://www.cnb ...
- 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 ...
- 洗礼灵魂,修炼python(65)--爬虫篇—BeautifulSoup:“忘掉正则表达式吧,我拉车养你”
前面解析了正则表达式,其实内容还挺多的对吧?确实挺适用的,不仅是python,其他语言或者web前端后端基本都要掌握正则表达式知识,但是你说,这么多,要完全的掌握,灵活运用的话,得搞多久啊?并且如果一 ...
- Linux Rsyslog日志集中管理
Linux Rsyslog日志集中管理 一.Rsyslog简介 ryslog 是一个快速处理收集系统日志的程序,提供了高性能.安全功能和模块化设计.rsyslog 是syslog 的升级版,它将多种来 ...
- Python面试题(二)【转】
转载出处http://www.cnblogs.com/goodhacker/p/3387027.html 1.python中类方法.类实例方法.静态方法有何区别? 区别: 类方法和静态方法都可以被类和 ...
- Linux 小知识翻译 - 「邮件服务器」
这次聊聊「邮件服务器」. 邮件服务器上通常会运行2个服务端软件,「SMTP服务器」和「POP服务器或者IMAP服务器」. 这2个东西,也许使用邮件客户端的人立马就明白了.因为设置邮件客户端的时候,需要 ...