js调试技巧和快捷键
⼀、“逐语句执⾏”或者“逐步执⾏”按钮：
    1、意思就是，每点击它⼀次，js语句就会往后执⾏⼀句
    2、快捷键F10
⼆、“逐过程执⾏”按钮：
    1、常⽤在⼀个⽅法调⽤多个js⽂件时，涉及到的js代码⽐较长，则会使⽤到这个按钮
    2、快捷键F8
三、console控制台：
    1、这个就是⼀个js解析器，是浏览器本⾝⽤来解析运⾏js的家伙，只不过浏览器通过console让我们开发者在调试过程中，可以控制js的运⾏以及输出。
    2、console.log()可以取代alert()或document.write()，在⽹页脚本中使⽤console.log()时，会在浏览器控制台打印出信息。
    3、console.dir()可以显⽰⼀个对象所有的属性和⽅法。
四、sources⾯板：
    1、源码⾯板，调试最重要的⼀个功能。
    2、Pretty print 按钮：格式化代码。
    3、Breakpoints ⼀栏：管理所有断点，可以⽅便地跳转到对应断点的位置处。
    4、Scope(变量作⽤域) ⼀栏：显⽰当前作⽤域和它的⽗级作⽤域，以及闭包。
五、jQuery 事件源码定位问题：
    将以下代码复制到控制台，按回车运⾏。
    1、适⽤于 1.5+ 版本的 jQuery：
function lookEvents (elem) {
return $._data ? $._data( elem, "events" ) : $.data( elem, "events", undefined, true );
}
var event = lookEvents($("#testbtn")[0]); // 获取绑定的事件
event.click[0].handler // 获取click事件的第⼀个事件源码地址
    2、适⽤于 1.2.6-1.4 版本的 jQuery：  　
js控制滚动条function lookEvents (elem) {
return $._data ? $._data( elem, "events" ) : $.data( elem, "events", undefined, true );
}
var event = lookEvents($("#testbtn")[0]); // 获取绑定的事件
event.click; // 查看有⼏个click事件，如果要查看其他事件直接输⼊ event 然后回车即可
六、debugger：调试器，即代码断点。
    1、⽤法⾮常简单，在写代码的时候，想要断点调试的地⽅写上 debugger 即可。
    2、调试按钮。
七、调试bug的思路：
    1、⾸先，js是否成功的执⾏进来；
    2、其次，js是否存在逻辑问题、变量问题、参数问题等等；
    3、最后，如果上述都没有问题，仔细查看各种符号。。。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。