利用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 相关文章推荐
常用参考资料(手册)下载或者链接
Jul 22 Javascript
JavaScript入门教程(5) js Screen屏幕对象
Jan 31 Javascript
一些常用的JavaScript函数(json)附详细说明
May 25 Javascript
javascript对talbe进行动态添加、删除、验证实现代码
Mar 29 Javascript
jQuery的文档处理程序详解
May 10 Javascript
jQuery 弹出层插件(推荐)
May 24 Javascript
AngularJS $injector 依赖注入详解
Sep 14 Javascript
JS正则表达式验证账号、手机号、电话和邮箱是否合法
Mar 08 Javascript
Angular中支持SCSS的方法
Nov 18 Javascript
Angularjs中date过滤器失效的问题及解决方法
Jul 06 Javascript
在create-react-app中使用sass的方法示例
Oct 01 Javascript
vuex存值与取值的实例
Nov 06 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+MySql编写聊天室
2006/10/09 PHP
PHP中,文件上传
2006/12/06 PHP
PHP判断搜索引擎蜘蛛并自动记忆到文件的代码
2012/02/04 PHP
php学习笔记之面向对象编程
2012/12/29 PHP
javaScript 读取和设置文档元素的样式属性
2009/04/14 Javascript
通过JS获取用户本地图片路径并显示的代码
2012/02/16 Javascript
javascript实现可改变滚动方向的无缝滚动实例
2013/06/17 Javascript
解析javascript 浏览器关闭事件
2013/07/08 Javascript
PHP开发者必须掌握的6个关键字
2014/04/14 Javascript
jQuery获得document和window对象宽度和高度的方法
2015/03/25 Javascript
面向切面编程(AOP)的理解
2015/05/01 Javascript
JS实现简单的右下角弹出提示窗口完整实例
2016/06/21 Javascript
80%应聘者都不及格的JS面试题
2017/03/21 Javascript
Angular中使用$watch监听object属性值的变化(详解)
2017/04/24 Javascript
微信小程序图片自适应支持多图实例详解
2017/06/21 Javascript
Webpack path与publicPath的区别详解
2018/05/03 Javascript
createObjectURL方法实现本地图片预览
2019/09/30 Javascript
Node.js API详解之 util模块用法实例分析
2020/05/09 Javascript
Vue解决echart在element的tab切换时显示不正确问题
2020/08/03 Javascript
[02:50]2014DOTA2 TI预选赛预选赛 大神专访第一弹!
2014/05/21 DOTA
多版本Python共存的配置方法
2017/05/22 Python
python3连接MySQL数据库实例详解
2018/05/24 Python
关于Django ForeignKey 反向查询中filter和_set的效率对比详解
2018/12/15 Python
Django模板Templates使用方法详解
2019/07/19 Python
面向对象学习之pygame坦克大战
2019/09/11 Python
在TensorFlow中屏蔽warning的方式
2020/02/04 Python
欧洲领先的技术商店:eibmarkt.com
2019/05/10 全球购物
俄罗斯皮肤健康中心:Pharmacosmetica.ru
2020/02/22 全球购物
搞笑婚礼主持词
2014/03/13 职场文书
简单的个人租房协议书范本
2014/11/26 职场文书
应届毕业生求职信范文
2015/03/19 职场文书
自主招生专家推荐信
2015/03/26 职场文书
详解CocosCreator消息分发机制
2021/04/16 Javascript
vue实现同时设置多个倒计时
2021/05/20 Vue.js
SQL Server2019安装的详细步骤实战记录(亲测可用)
2022/06/10 SQL Server
Windows server 2003卸载和安装IIS的图文教程
2022/07/15 Servers