常见bug 的分析及解决办法

97 阅读2分钟

调试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个参数

原因分析

  • 一般是括号内只写了一个参数,导致无法执行

解决办法

  • 检查元素是否设置成功

  • 检查是否有赋值

  • 检查前后拼写是否一致