利用Js的console对象,在控制台打印调式信息测试Js的实现


Posted in Javascript onNovember 26, 2016

一次偶然的机会,打开百度的时候按下了F12,然后就见控制台里面输出了百度的招聘广告,感觉挺帅气的,再然后就有了这篇博文。

既然可以这样在控制台输出信息,那以后再调试Js的时候不就可以省去很多麻烦了嘛!避免不误人子弟,特意使用for(var i in console)查看了下各种浏览器控制台对console的支持,

结果如下:

IE 11 控制台

log , info , warn , error , debug , assert , time , timeEnd , group , groupCollapsed , groupEnd , trace , clear , dir , dirxml , count , countReset , cd , select , profile , profileEnd

Firebug 控制台

log , debug , info , warn , exception , assert , dir , dirxml , trace , group , groupCollapsed , groupEnd , profile , profileEnd , count , clear , time , timeEnd , timeStamp , table , error

Chrome 控制台

memory , _commandLineAPI , debug , error , info , log , warn , dir , dirxml , table , trace , assert , count , markTimeline , profile , profileEnd , time , timeEnd , timeStamp , timeline , timelineEnd , group , groupCollapsed , groupEnd , clear

可以看出,以上我测试的浏览器对 log , info , warn , error , debug 五个基本方法都是支持的,注意,我使用的是 IE 11,其他版本我没测试,而 Firefox 本身也是不带控制台的,需要加载Firebug 插件并且启动它,才能console,否则就是Js报错了。为了使用起来更方便,可以自己封装一下,判断一下浏览器对 console 的支持,不支持就只能使用原始的 alert 或者其他方法了。

简单用法:

console.log("日志信息");
console.info("一般信息");
console.debug("调试信息");
console.warn("警告提示");
console.error("错误提示");

格式化输出:

console.log("%d年%d月%d日", 2014, 5, 20);//日期格式输出
console.log('%c有颜色的输出信息', 'color:white; background-color:#0055CC');//格式输出

输出变量:

var who= 'you';
console.log('输出变量 We support  ', you);//读取变量

输出数组:

var arr = [1, 2, 3, 4, 5];
console.log('数组:', arr);//输出数组

以上这篇利用Js的console对象,在控制台打印调式信息测试Js的实现就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery父级以及同级元素查找介绍
Sep 04 Javascript
JS Loading功能的简单实现
Nov 29 Javascript
struts2+jquery组合验证注册用户是否存在
Apr 30 Javascript
原生js实现tab选项卡切换
Mar 23 Javascript
浅谈js中的变量名和函数名重名
Feb 13 Javascript
vue.js 1.x与2.0中js实时监听input值的变化
Mar 15 Javascript
微信小程序 图片宽高自适应详解
May 11 Javascript
node.js中cluster的使用教程
Jun 09 Javascript
vue中,在本地缓存中读写数据的方法
Sep 21 Javascript
angular使用md5,CryptoJS des加密的方法
Jun 03 Javascript
使用Vue实现调用接口加载页面初始数据
Oct 28 Javascript
js+canvas实现图片格式webp/png/jpeg在线转换
Aug 22 Javascript
JS类的定义与使用方法深入探索
Nov 26 #Javascript
js控制台输出的方法(详解)
Nov 26 #Javascript
jQuery基于排序功能实现上移、下移的方法
Nov 26 #Javascript
node.js中的事件处理机制详解
Nov 26 #Javascript
使用node.js中的Buffer类处理二进制数据的方法
Nov 26 #Javascript
火狐和ie下获取javascript 获取event的方法(推荐)
Nov 26 #Javascript
JS基于递归实现倒计时效果的方法
Nov 26 #Javascript
You might like
PHP Smarty生成EXCEL文档的代码
2008/08/23 PHP
PHP has encountered an Access Violation 错误的解决方法
2010/01/17 PHP
浅析PHP substr,mb_substr以及mb_strcut的区别和用法
2013/06/21 PHP
PHPMailer的主要功能特点和简单使用说明
2014/02/17 PHP
codeigniter自带数据库类使用方法说明
2014/03/25 PHP
PHP+Javascript实现在线拍照功能实例
2015/07/18 PHP
php获取给定日期相差天数的方法分析
2017/02/20 PHP
javaScript 关闭浏览器 (不弹出提示框)
2010/01/31 Javascript
jQuery学习笔记 操作jQuery对象 文档处理
2012/09/19 Javascript
js中for in的用法示例解析
2013/12/25 Javascript
js判断字符长度及中英文数字等
2014/03/19 Javascript
理解JavaScript的变量的入门教程
2015/07/07 Javascript
JavaScript的Number对象的toString()方法
2015/12/18 Javascript
javascript特殊日历控件分享
2016/03/07 Javascript
Google 地图API Map()构造器详解
2016/08/06 Javascript
JavaScript生成.xls文件的代码
2016/12/22 Javascript
js实现自定义路由
2017/02/04 Javascript
基于js中的原型(全面讲解)
2017/09/19 Javascript
arctext.js实现文字平滑弯曲弧形效果的插件
2019/05/13 Javascript
[01:18]PWL开团时刻DAY4——圣剑与抢盾
2020/11/03 DOTA
python实现的防DDoS脚本
2011/02/08 Python
python基础教程之Hello World!
2014/08/29 Python
Python与shell的3种交互方式介绍
2015/04/11 Python
python中迭代器(iterator)用法实例分析
2015/04/29 Python
python对配置文件.ini进行增删改查操作的方法示例
2017/07/28 Python
Python中用post、get方式提交数据的方法示例
2017/09/22 Python
Python中列表与元组的乘法操作示例
2018/02/10 Python
python中dict()的高级用法实现
2019/11/13 Python
Django 自定义权限管理系统详解(通过中间件认证)
2020/03/11 Python
30行Python代码实现高分辨率图像导航的方法
2020/05/22 Python
浅谈HTML5新增和废弃的标签
2019/04/28 HTML / CSS
大学自主招生自荐信范文
2014/02/26 职场文书
金融学专业大学生职业生涯规划
2014/03/07 职场文书
优秀班组申报材料
2014/12/25 职场文书
详解Redis瘦身指南
2021/05/26 Redis
详解overflow:hidden的作用(溢出隐藏、清除浮动、解决外边距塌陷)
2021/07/01 HTML / CSS