调试Bug的指引(排名不分先后)
1 确定打开的文件是否正确
2 确定文件是否成功引入
3页面检查是否有报错,对症下药
4检查编译器有无提示报错并修改
1.span is not defined ,span没有定义
原因分析
-
1变量没有定义
-
2括号内没有添加引号
解决方法
-
1先定义变量在使用变量
-
2注意细节括号内添加引号
2Cannot read properties of null (reading 'style')
不能使用null读取属性style,元素获取为空
-
原因分析
-
1类名设置错误
-
2结构内没有设置对应的类名(有果没有因),导致找不到类名返回一个空值
-
3类名对应不上,拼写错误
-
4获取的是数组却返回了一个值,导致返回空值
-
-
解决办法
-
1类名直接复制粘贴
-
2写代码之前先思考为什么要写这一行代码,写一句打印一句验证结果
-
3返回数值的结果使用对应数组的方法 selectorAll 若替换为selector则会导致错误
-
3ERR_FILE_NOT_FOUND:路径错误
原因分析
- 路径书写错误,漏前缀或者后缀,常见于图片,域名以及文件回传(src https)
解决方法
- 图片注意jph url,src后留意是否有加./
4Identifier 'XXX' has already been declared
标识 XXX 已 经 被 声明
原因分析
- let声明多个变量导致重复
解决办法
- 规范声明变量,每个变量只能出现一次,语义化声明变量,前期不会可借助翻译
5Cannot read properties of null (reading 'style')因为无法读取属性,所以无法使用 null 读取 style,
原因分析
- 一般是因为元素获取不成功,返回了null空值
解决办法
-
检查元素是否设置成功
-
检查是否有赋值
-
检查前后拼写是否一致
6Failed to execute 'xxx' on 'Node': 2 arguments required, but only 1 present.无法执行"xxx",因为需要2个参数但是只有1个参数
原因分析
- 一般是括号内只写了一个参数,导致无法执行
解决办法
-
检查元素是否设置成功
-
检查是否有赋值
-
检查前后拼写是否一致