js调试

什么是bug?

程序错误,程序漏洞

调试(debug)步骤

1.发现错误
2.定位错误
3.找出原因
4.提出办法
5.纠正并测试

调试的秘诀

从心里鄙视写出的bug,制造出智力上的优越感才能发现bug。

定位错误

调试HTML/CSS/JS/网络错误

CSS调试

使用开发者工具:
选择器错误(开发者工具右侧有没有选择器)
注释会错(CS只有/**/这种注释方式)
属性名(出现警示则是语法错误,首先可以在开发者工具里面的推荐写一遍,也可以把鼠标放警示标志上面)
值会错
值会被覆盖(background的transparent和none冲突)
分号会错
border调试大法

js调试

从css开始调试,有时候是css写错了
console.log大法
1.确定你的代码运行了,函数调用了
2.确定了数据类型再打值(console.log(typeof button))
3.确定值
4.找出与预期不一致的地方
还有二分法(打印console.log(1));打印元素
辅助方法断点:
sources-break.html-加断点-刷新-高亮的地方没有运行。
同时watch查看所有变量,打开控制台。
断点分为条件断点、ajax断点、Dom断点
还有一种断点是debugger。

网络请求

ajax:1.看网络请求有没有发出去;2.参数和(header)3.数据格式(preview(后端的数据格式))+console.log

注释法

如果有很多错误,就分块注释(对代码不了解的情况下)

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 作者:百码山庄原文地址:http://seejs.me/2016/03/27/jsdebugger/ 前言:调试技...
    IT程序狮阅读 5,806评论 2 50
  • 在网站开发中,我们难免会遇到各种bug,这时,我们就需要去调试我们的JavaScript脚本找出问题,然后去修改代...
    他在发呆阅读 3,339评论 0 0
  • chrome developer tool 调试技巧 http://ued.taobao.org/blog/201...
    栋栋晓阅读 3,106评论 0 3
  • 前言 Chrome 算是开发者用的最多的工具了。而其中的控制台更是调试JS的利器,今天就学习一下基本的控制台的JS...
    SolaTyolo阅读 4,143评论 0 0
  • 前端工作中,不仅编码很重要,重现bug,解决bug的能力同样重要。而这些都离不开代码调试。现就一些调试技巧做出总结...
    tiancai啊呆阅读 3,196评论 0 0

友情链接更多精彩内容