JavaScript 在Firefox上的调试器使用

黄良钵

分类: 程序开发 0 0

  1. <body>
  2.     <div>这是DIV</div>
  3.     <script>
  4.         var a = '123'
  5.         a +='456'
  6.         // alert(a)
  7.         // console.log('a:%s',a)
  8.         // console.dir(a)
  9.         // 断点是一个特殊的代码标记 程序执行到断点时会暂停执行
  10.         // 通过断点可以观察到正在执行的程序的内部状态
  11.         // 所有的断点都会显示在资源窗口中形成断点列表
  12.         // 点击前面的筛选框可以暂时禁用或启动断点
  13.         // var me = {
  14.         //     name:'xiaoming',
  15.         //     age:3,
  16.         //     isMale:true,
  17.         //     course:{
  18.         //         name:'HTML5',
  19.         //         months:6
  20.         //     }
  21.         // }
  22.         // console.log(me)
  23.         // 在变量窗口中可以逐层展开一个对象
  24.         // 深入对象内部可以查看对象的属性方法 类型 以及对象的父类
  25.         function add(a,b){
  26.             return a + b
  27.         }
  28.         var c = add(3,5)
  29.         // F10 逐步执行
  30.         // F8 一直执行直到结束遇到下一个断点
  31.         // F11 进入函数内部
  32.         // shift + F11 从函数内部跳出
  33.         // 左下角三个按钮
  34.         // 第一个:开启或关闭黑盒 压缩后的代码通常在黑盒中 调试时不会进入 但可以打开
  35.         // 第二个:美化代码 将压缩的代码重新格式化
  36.         // 第三个:启用或禁用断点
  37.         // 调用栈
  38.         // 函数相互调用形成的调用关系 如 A -> B -> C -> D
  39.         // 调用栈是从下往上调用的 最下面是代码入口 
  40.         // 点击调用栈上的项可以看到进入下一个函数的位置
  41.         // 事件:可以查看所有的事件监听者
  42.         // 勾选后事件发生时会直接暂停 就像加了一个断点一样
  43.         var div =document.querySelector('div')
  44.         div.onclick = function(e){
  45.             alert('你点击了div')
  46.         }
  47.     </script>
  48. </body>
  • 0人 Love
  • 0人 Haha
  • 0人 Wow
  • 0人 Sad
  • 0人 Angry
JavaScript、调试器

作者简介:黄良钵

打赏

博客站长,前端开发工程师

共 0 条评论关于 “JavaScript 在Firefox上的调试器使用”

Loading...