业界动态
如何去定位你在调用哪个function()?
2024-12-11 10:40

         在调JS的时候,有时候我们根本不知道那是入口点,因为你的一个页面在运行的时候来的是n个页面的合成,

如何去定位你在调用哪个function()?

有可能是一个页面来自N多个JS文件,OK那么你是怎么去定位当前的ONCLICK所调用的函数来自哪个JS文件呢?

如何定位当前页面所加载的JS是那个文件的入口点呢?以下是自己的小经验吧,总结下跟大家分享下


1.神奇的alert,”走到我就弹出来“

场景:我在修一个BUG的时候,出现的一个问题

在整个页面只有一个DIV

不是当页面加载的时候会异步调用后台的处理程序返回一个HTML的字符串放到这个DIV里面(我很讨厌这样的

写法,我问之前的那小子为什么这么写,他说这样是有利于代码的隐藏,我一看就汗,代码估计就这么被他养死了,太难

维护了。。。以后我不要设计出这么变态的框架)

目的:我要找到提交按钮调用的那个方法(因为里面有BUG哦)

   我先通过firebug找到了当前单击按钮调用的方法名称,但是我整个项目里面搜索,找带了5个文件都有这个名称,天呀,

到底那是当前ONCLICK所调用的方法呀,很头大。


呵呵,虽然我不是专业的JS开发人员,但是我知道ONCLICK呀(幸好是只有5个方法),我在5个函数里面分别加了

aler(1),alert(2),alert(3),alert(4),alert(5),然后保存,让其重新跑起来,当我点击按钮的时候显示的是aler(1),OK,

这样就找到了当前调用的函数的位置了


总结: alert()很好用,也很给力,只要你写alert(1),alert(2),然后就可以定位当前的位置,注意不是数据库的alter

2.给力的debugger,“走到我就停下来”


  我最喜欢的一个工具“debugger”,当你知道入口函数了,然后但是想知道里面的程序在跑起来的时候是怎么的,这时候直接用debugger就ok了。

总结:“我想让程序在那里停下来我就debugger到那”这个主要是你想跟着JS代码跑起来的时候想看到的具体程序在跑的时候是怎么个情况,OK,

那他是最给力的一个方法了,但是要注意,跑完了一定要删除哦,要不测试人员会来找你麻烦的。


解决调试JS脚本的一般思路:


1.找到调用JS的页面。


  如果一个页面出问题了,那么最快的方法是在页面上右击,属性找到当前文件所在的位置找到之后,可以查看里面的JS引用是否超多?是否就

一个JS引用?是否很多JS引用?然后根据自己经验,看看代码入口点是什么?根据自己推测,出BUG的位置在哪里,如果JS写在当前页面且很少,

那就没必要跟断点了,直接看就OK 了。


总结:因为有的时候,你的页面很有可能是来自各个用户控件的,这样可以马上定位到你当前的文件位置

2.找到你想定位的位置

  你可能是在页面加载的时候,也可能在点击一个按钮的时候,等等,所有调用JS的位置,你尽可能的去找了,修BUG的就比较明显了,尤其

是JS的BUG,目标性很明确,这个时候只要你找到调用函数的名称,就可以找到当前函数的位置了(这个时候你可以整个项目里面去搜索),

就可以找到你JS的位置了


总结:这是你想定位的位置了,如果你实在是没办法,就用我场景一里面的思路吧,直接alert去,不择手段的去定位你当前的位置

3.实用debugger一步一步跟进去

   找到出问题的位置,如果实在不知道出问题的在那里,那么就从页面加载的位置看起吧,在页面加载的时候一步一步跟下去,在你跟的出

问题的地方打个断点当出现问题的时候,如果你安装了调试JS的工具会跳出来告诉你那出错了,这个时候是最好的,这时候,你可以直接点

击调试工具进行调试


总结:这是人为最没办法的办法了。


4.“抓”到当前页面的所有的JS

如果你还是定位不到当前的问题出在那,你可以通过,右击"查看源文件",在页面的头部有js,你需要做的是找到里面所有的src,然后在用HTTP

把文件下载下来,然后自己分析。这样拿到的JS是你当前页面引用的所有的JS文件(虽然这个文件拿到了,但是我感觉实用的价值不大,因为有

的时候这个文件就是很多没用方法的陈述),当然这个方法也可以拿到.CSS文件。不喜欢这个方法,但是有时候,你没源码,又想知道,当前

页面调用的所有的JS或者其中一个方法的含义,呵呵,这个方法是超级好用的。一抓就抓一大把

总结:这个对你的JS优化有很大的好处,看看JS文件的大小,以及多少方法用到JS



5.反复


当你去调试JS的时候,有可能定位的位置不对,那么请你反复重复2.3步骤,一个alert,一个debugger足矣。


总结:一个alert,一个debugger足矣,最后注意一定要删除alert,debugger

  自己不喜欢用调试工具,所以基本是alert,debugger去处理问题,算是习惯吧,不知道大家是怎么去调试的,大家可以交流下。










    以上就是本篇文章【如何去定位你在调用哪个function()?】的全部内容了,欢迎阅览 ! 文章地址:http://sicmodule.glev.cn/news/12487.html 
     资讯      企业新闻      行情      企业黄页      同类资讯      首页      网站地图      返回首页 歌乐夫资讯移动站 http://sicmodule.glev.cn/mobile/ , 查看更多   
最新新闻
京东改手机号(京东改手机号码)
  关于《京东改手机号》的指南  随着互联网的普及和电子商务的飞速发展,京东作为中国最大的电商平台之一,吸引了众多用户的
手机唤醒功能(手机唤醒功能在哪)
  文章标题:《手机唤醒功能:科技之光唤醒生活的便捷性》  随着科技的飞速发展,智能手机已经成为了我们日常生活中不可或缺
手机用什么p图软件(手机用什么p图软件不压缩)
  手机用什么P图软件?全面解析当下最热门的移动修图工具  随着智能手机的普及,人们对照片的美观度要求越来越高。因此,各
手机架怎么折(手机架怎么折视频教程)
  标题:《手把手教你折出实用的手机架》  在当今时代,手机已成为我们日常生活中不可或缺的伴侣。随着手机的普及,手机架也
手机内存空间不足怎么清理(手机内存空间不足,建议清理)
  关于《手机内存空间不足怎么清理》的文章  随着智能手机的普及,我们的手机中存储的信息越来越多,无论是工作文件、照片、
手机场景图(手机场景服务在哪里)
  关于《手机场景图》的文章  随着智能手机的普及,我们的生活越来越离不开手机。在日常生活中,我们会用手机拍摄各种场景,
手机没电了打电话提示什么(手机没电了打过去会提示什么)
  文章标题:《手机没电了打电话提示什么》  在这个科技日新月异的时代,手机已成为我们日常生活中不可或缺的一部分。然而,
手机没充满电拔了对手机有坏处吗(手机充电中途拔掉会影响手机吗)
  关于《手机没充满电拔了对手机有坏处吗》的探讨  随着科技的飞速发展,智能手机已成为我们日常生活中不可或缺的伙伴。与此
华为手机图案解锁(华为手机图案解锁设置不见了)
  华为手机图案解锁:一种直观且便捷的安全方式  随着科技的进步和智能手机的普及,手机安全成为人们日益关心的问题。在众多
天马手机屏幕(天马手机屏幕寿命)
  天马手机屏幕:技术与艺术的完美结合  在当今智能手机市场,天马手机屏幕以其卓越的品质和技术创新赢得了广大消费者的青睐