zoukankan      html  css  js  c++  java
  • Chrome console命令整理

    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

  • 相关阅读:
    jquery的$().each,$.each的区别
    前端面试题整理
    JS中Null与Undefined的区别
    LESS介绍及其与Sass的差异(转载自伯乐在线,原文链接:http://blog.jobbole.com/24671/)
    APP 弱网测试
    ADB命令
    pytest之参数化parametrize的使用
    APP测试
    python 异常捕捉
    pip 安装依赖 requirements.txt
  • 原文地址:https://www.cnblogs.com/youxin/p/6142702.html
Copyright © 2011-2022 走看看