如何防止断点调试进入jquery库
分类:实例代码
使用谷歌等浏览器进行断点调试一定不会陌生。
如果调试jQuery或者其他需要引入库的代码时候,大家有没有遇到过进入jquery库或者其他库的内部,如果这样那真的是非常的痛苦,从下面就来介绍一下如何尽量避免这种情况或者尽量的减轻痛苦。
下面先解释一下断点调试中经常用到的按键,后面会用到:
(1).F8:恢复运行。
(2).F10:步过,遇到自定义函数也当成一个语句执行,而不会进入函数内部。
(3).F11:步入,遇到自定义函数就跟入到函数内部。
(4).Shift + F11:步出,跳出当前自定义函数。
下面就通过代码实例介绍一下各个按键或者按键组合的作用。
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.pipipi.net/" /> <title>前端教程网</title> <style type="text/css"> #antzone { height: 30px; width: 100px; background: #ccc; text-align:center; line-height:30px; } </style> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <script type="text/javascript"> $(document).ready(function () { $("#bt").click(function () { $("#antzone").animate({ "width": "1000px" },5000); $("#antzone").text("前端教程网"); }); }) </script> </head> <body> <div id="antzone"></div> <input type="button" id="bt" value="查看效果" /> </body> </html>
我们在上面的代码中,设置两个断点,截图如下:
当点击按钮之后,那么就停在20行断点处,点击F8就是恢复运行,遇到下一个断点再停止,一直这样重复下去。
如果点击F10的话,就会将自定义函数看做为一个语句,不会进入函数内部。
如果点击F11的话,就非常的认真仔细了,每一条语句都会进入,这样就会进入jquery库内部。
但是在实际调试中,点击F10依然能够进入jquery,这个时候使用Shift + F11就可以跳出那个进入的函数了。
一线大厂高级前端编写,前端初中阶面试题,帮助初学者应聘,需要联系微信:javadudu