自己在Web前端项目中解决bug的思路

在项目中往往会遇到各种各样的程序bug,而且有些bug很隐蔽。例如仅仅一个字母引发的“血案”……

因为刚刚入行,所用的技术不够强劲,所以很多技术都是老套的办法。现在咱把前不久公司的一个项目中的bug修复办法及思路给记录下来,以便将来用于往后的工作当中。

首先是bug的运行(不知道咋说,应该bug的演示吧)和代码片段:

让该程序出现bug的第一步:

  首先,单击红圈中的“主页链接”

然后进入到以上的界面。

此时:单击图中上部的“用户界面”的XX(翻译:叉叉)按钮,则页面的结果如下:

  整个页面呈现一片空白:

调查浏览器开发工具中element便签下的代码显示结果是这样子:

iframe下style的属性里display值很明显为none,说明内容在标签页里有,只是未显示出来。此时bug演示完毕。

晒下代码片段:y

代码分析:

当切换灰色的按钮时,因没有将页面调出来,促使“用户界面”处于unvisible状态。当进程移除操作是,代码运行至


时会将“主页”页面移除,而保留“用户界面”。然而用户界面此时并未改变显示方式,于是整个页面呈现出一片空白的状态。

 以下是bug进行修复后的代码片段:

红色框内为修改后的内容。首先,获取当前要删除对象的ID,然后通过ID获取要移除的iframe,当移除iframe后,进行一次判断,判断是否有iframe显示,如果iframe无显示状态,则将最后一个iframe默认改为显示状态---此时bug没有再显示(暂时修复)。

通过此次修复这个小bug中,本人学习到了一些工作中需要用到的知识:

首先,项目中往往时间的原因,无法将整个项目的代码完完整整的通读一遍,而且将整个代码完全理解透也不切实际。而且很多情况下一期项目完后,很少有人会将项目内的代码完完整整的进行关键性注释。这个时候针对性模块理解起到了一定的关键作用。

针对自己在项目中要增加、修改的模块花些时间进行理解很重要,而且因为时间原因,一旦遇到了不理解的地方不能一直死盯着,需要合理的跳过。很多项目中,模块之间是相互联系的,虽然在此模块中不能将一部分代码理解,但是往往到另一个模块中却会惊奇的发现:之前模块中遇到的不理解的代码片段在此模块中会很容易的理解出来。

  • 2
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值