console.dir (这个方法是我经常使用的 可不知道比for in方便了多少) 直接将该DOM结点以DOM树的结构进行输出,可以详细查对象的方法发展等等

在页面右击选择 审查元素 ,然后在弹出来的DOM结点树上面随便点选,这些被点过的节点会被记录下来,而 $0 会返回最近一次点选的DOM结点,以此类推,$1返回的是上上次点选的DOM节点,最多保存了5个,如果不够5个,则返回 undefined 。

Chrome 控制台中原生支持类jQuery的选择器 ,也就是说你可以用 $ 加上熟悉的css选择器来选择DOM节点

copy 通过此命令可以将在控制台获取到的内容复制到剪贴板

如copy(document.body)

(从控制台复制的body里面的html可以任意粘贴到哪 比如记事本   )

keys和values 前者返回传入对象所有属性名组成的数据,后者返回所有属性值组成的数组

var myObj={name:'user1',sex:"female"}
 
keys(myObj)
["name", "sex"]

values(myObj)
["user1", "female"]

高级Javascript调试——console.table()

试想一下,假如你创建了一个编程语言以及其文件后缀名列表:

var languages = [
{ name: "JavaScript", fileExtension: ".js" },
{ name: "TypeScript", fileExtension: ".ts" },
{ name: "CoffeeScript", fileExtension: ".coffee" }
]; console.log(languages);

console.log()会显示如下信息:

该树视图对于调试是非常有用的,但我们不得不手动打开每个折叠的对象来查看,比较麻烦。我们可以使用console.table()得到更好的体验。

通过console.table()打印数组

现在我们使用console.table()进行打印。

console.table(languages);

你可以看到如下表格:

整齐漂亮,不是么?

当然表单最适合表单数据呈现。如果每个对象都拥有不同的结构,那么最后会发现有很多单元是undefined。尽管如此,属性值都是整齐排列的,并给你很好的概述。

monitor & unmonitor

monitor(function),它接收一个函数名作为参数,比如 function a ,每次 a 被执行了,都会在控制台输出一条信息,里面包含了函数的名称 a 及执行时所传入的参数。

而unmonitor(function)便是用来停止这一监听。

function sayHello(name) { alert('hello,'+name); }
undefined
monitor(sayHello)
undefined
sayHello('me')
VM1299:1 function sayHello called with arguments: me

看了这张图,应该明白了,也就是说在monitor和unmonitor中间的代码,执行的时候会在控制台输出一条信息,里面包含了函数的名称 a 及执行时所传入的参数。当解除监视(也就是执行unmonitor时)就不再在控制台输出信息

、console.count(这个方法非常实用哦)当你想统计代码被执行的次数

function myFunction() { /*其他函数逻辑*/ console.count("myFunction被执行次数"); }
undefined
myFunction()
VM1671:1 myFunction被执行次数: 1
undefined
myFunction()
VM1671:1 myFunction被执行次数: 2

Chrome console命令整理的更多相关文章

  1. chrome console 命令简记

    1.快速迭代元素 $$('tr.dispute-num td strong a').map(function (el) { return el.innerHTML; }) 2.复选框选中/取消选中 c ...

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

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

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

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

  4. js调试工具Console命令详解

    这篇文章主要介绍了js调试工具Console命令详解,需要的朋友可以参考下   一.显示信息的命令 复制代码 代码如下: < !DOCTYPE html> < html> &l ...

  5. 9 个让 JavaScript 调试更简单的 Console 命令

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

  6. 常用git命令整理

    花了一点时间来熟悉和整理git常用命令. 推荐的git学习资料:1.搜“Git Community Book 中文版.pdf”,git社区书,内容全面且简明扼要,第一推荐2.搜“Git权威指南.pdf ...

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

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

  8. chrome console 调试xpath

    chrome console F12->$x(“//title”) [<title>Online Tools for Software Developers (Free)</t ...

  9. 常用的shell命令整理

    工作快一年了,shell命令也玩了一年了.还是有点积累的,下面是本人常用的. 1.pwd | xargs -i basename {}   获取当前所在目录的名称 2.ps -ef|grep -w   ...

随机推荐

  1. response.sendRedirect()与request.getRequestDispatcher().forward()区别

    Servlet中response.sendRedirect()与request.getRequestDispatcher().forward(request,response)这两个对象都可以使页面跳 ...

  2. MT4平台经验总结

    https://www.mql5.com/zh/code/8462 https://www.mql5.com/zh/code/8074 https://www.mql5.com/zh/code/787 ...

  3. iOS GCD学习笔记

    // 后台执行: dispatch_async(dispatch_get_global_queue(, ), ^{ // something }); // 主线程执行: dispatch_async( ...

  4. 【异常】ORA-01536: space quota exceeded for tablespace

    ### The error may exist in /src/main/resources/com/star/css/dao/sql/workflow.xml ### The error may i ...

  5. Java_ClassLoader内存溢出-从tomcat的reload说起

    原文链接:http://nius.me/classloader-memory-leak/ 对于j2ee项目,一直使用eclipse的wtp,每次修改代码后,可以自动热部署.简单的项目wtp似乎没什么问 ...

  6. JavaScript 三级联动

    附件连接下载地址:http://files.cnblogs.com/files/CaktyRiven/js.zip <!DOCTYPE html> <html lang=" ...

  7. 2016huasacm暑假集训训练四 数论_A

    题目链接:http://acm.hust.edu.cn/vjudge/contest/125308#problem/F 题意:狼捉兔子,兔子躲在n个洞中一个,这n个洞围成一个圈,狼会从第0号洞开始,搜 ...

  8. JS for循环 闭包

    对于for循环的闭包问题的理解,认为需要理解函数中的变量的作用域链的概念 另外提及下变量提升的概念 如下例子: var ar = [];for(var i=1:i<10; i++){ ar[i] ...

  9. wordpress 分类相关

    分类类型,层级 wp中的分类.文章类型(post,page,video,image).标签.自定义分类.自定义标签都是分类形式.有些分类是有层级关系,有些没有.如图: taxonomy分类(categ ...

  10. MySQL 实现row_number() 分组排序功能

    数据库基本脚本 CREATE TABLE `a` ( `ID` INT(10) NULL DEFAULT NULL, `class` INT(10) NULL DEFAULT NULL, `score ...