在调试JavaScript程序时,有时需要dump某些对象的详细信息。通过手工编写JavaScript代码可以完成这一工作:针对对象的属性进行循环,将循环到的每一个属性值打印出来;可见,这一过程是比较繁琐的。在具备调试工具的浏览器上,这一工作可以通过console.dir()语句来方便的完成。

console.dir()的使用

console.dir()的使用非常简单,直接将需要dump的对象传入该语句即可。比如以下的例子:

代码如下:

function cat(name, age, score){
    this.name = name;
    this.age = age;
    this.score = score;
}
var c = new cat("miao", 2, [6,8,7]);
console.dir(c);

通过使用console.dir(),新建的cat对象信息被dump出来了。在Firebug控制台中其显示结果为:

如果需要dump的是一个DOM对象,那么使用console.dirxml()会得到更好的显示效果。

浏览器支持

console.dir()和console.dirxml()在有调试工具的浏览器上支持较好,各大浏览器均支持此功能。

console.dir() 与 console.dirxml() 的使用的更多相关文章

  1. console.dir() 与 console.log() 区别

    Difference console.log prints the element in an HTML-like tree console.dir prints the element in a J ...

  2. console.dir()和console.log()的区别

    console.log()可以取代alert()或document.write(),在网页脚本中使用console.log(data)时,会在控制台打印出数据. console.dir()可以显示一个 ...

  3. 【转】console.dir()和console.log()的区别

    原文链接:https://blog.csdn.net/ky1in93/article/details/80828499 console对象详解:https://segmentfault.com/a/1 ...

  4. 前端调用接口报错看不到报错响应时 console.dir

    console.dir() 可以看到很多.log看不到的属性和方法

  5. console.dir(someObject);

    <script type="text/javascript"> function test(){ var array = [{"id":1},{&q ...

  6. console.log与console.dir的区别

    今天学习promise的时候看到了console.dir这个方法,感到很好奇,查了以下感觉又长知识了 在Chrome中,控制台对象定义了两个似乎做同样事情的方法: console.log() cons ...

  7. console.log()与console.dir()

    console.log()可以取代alert()或document.write(),在网页脚本中使用console.log()时,会在浏览器控制台打印出信息. console.dir()可以显示一个对 ...

  8. console.dir()可以显示一个对象所有的属性和方法

    console.dir()可以显示一个对象所有的属性和方法 具体方法如下:

  9. 避免console错误,console兼容

    背景:写js代码时写了很多console.log进行日志打印,最后上生产时不想删除日志输出, 但是ie在不打开控制台时,日志输出会导致后续js不执行,所以需要适时屏蔽js日志输出 (IE等不支持con ...

随机推荐

  1. Thinkphp面试问题

    1.如何理解TP中的单一入口文件? 答:ThinkPHP采用单一入口模式进行项目部署和访问,无论完成什么功能,一个项目都有一个统一(但不一定是唯一)的入口.应该说,所有项目都是从入口文件开始的,并且所 ...

  2. 小Z的袜子(hose) HYSBZ - 2038 (莫队算法)

    原文地址:http://hzwer.com/2782.html 「BZOJ2038」[2009国家集训队] 小Z的袜子(hose) 2014年4月26日13,34721 Description 作为一 ...

  3. MT【152】不患寡而患不均

    ((清华2017.4.29标准学术能力测试1) $a_1,a_2,\cdots,a_9$ 是数字$1$到$9$ 的一个排列,则 $a_1a_2a_3+a_4a_5a_6+a_7a_8a_9$ 的最小值 ...

  4. 【刷题】HDU 1853 Cyclic Tour

    Problem Description There are N cities in our country, and M one-way roads connecting them. Now Litt ...

  5. Spring点滴一:Spring Ioc 容器

    Spring 容器: Spring 容器是Spring框架的核心.Spring容器将创建Bean对象实例,把它们联系在一起,配置它们,并管理它们整个生命周期从创建到销毁.Spring 容器通过依赖注入 ...

  6. 20135319zl内核模块编译报告

    内核模块编程学习报告 1.编写一个简单的输出信息的模块 源代码: Makefile 编译模块 加载模块 测试模块(dmesg) 卸载模块 Sudo rmmod 1 使用dmesg查看情况 2.输出当前 ...

  7. Java考试题之五

    QUESTION 102 Given: 23. Object [] myObjects = { 24. new Integer(12), 25. new String("foo") ...

  8. 20170520 DP阶段总结

    DP的力量不是无穷的. 但是,因为它叫做“动态规划”,它在OI界如鱼得水.这个“动态”不是指“离线”与“在线”,也不是什么“可持久化”.它只是把问题抽象为一个个“阶段”,在每一个“阶段”中作出或繁或简 ...

  9. React-Router 动画 Animation

    React-Router动画实际上和React动画没什么区别,都是使用 'react-addons-css-transition-group' 这个组件:但是,和普通的 React-Router 的 ...

  10. Html5 drag&drop

    下面是一个拖放例子 定义如下的两个div,分别是用于拖放后放置新元素的容器和可拖动的元素: <body> <div id="holder" style=" ...