首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    调试JS代码

    记录下近期对JS代码的调试过程 性能分析 启动程序之后,打开google浏览器对应页面,按F12或者Ctrl+Shift+I进入 开发者工具页面 目前主要使用的功能有: Performance....性能评估,比如我想看下页面刷新的性能瓶颈所在,先点击 按钮,然后进行页面操作,当页面刷新完成,再点击 按钮,则会生成性能报告,可以看到资源消耗,JS代码的执行逻辑等 Sources....性能报告页面的 部分,可以通过点击色块查看其所在的js代码文件,如 点击则会跳转到 功能栏,有了源文件就可以进行断点调试;这里注意部分js文件是压缩后的文件,建议手动修改程序替换成可读性更强的原始代码文件...,方便调试 Console....查看程序的打印输出,比如我想知道某个函数的执行时间,可以在js代码中进行修改 当js代码执行之后,可以在console输出中看到foo的执行时间 Network.

    19K10

    Fiddler远程调试js

    使用Fiddler调试本地js   在我们前端开发的日常工作中,发现服务器上某个css/javascript文件有问题,需要修改,那真是家常便饭。...假设我们发现这个页面有问题,需要修改所引用的js文件()。 第一步:用Fiddler查看页面的数据流列表,找到这个js文件的session ?  ...在这个js session上右键点击,选择“Save – Response –Response Body…”,将js文件的内容保存到本地。记住存的位置,下面我们会用到这个保存下来的文件。...通过以上几个步骤,我们演示了怎样将HTTP请求重定向到本地的文件,进行web调试。...这种调试方式不需要发布到线上再验证,避免了修改不成功、对用户造成影响的风险,而且不需要搭建复杂的开发服务器等开发环境,非常适合快速web调试

    10K30

    js对象

    课程目标: 1.掌握面向对象的基本操作. 2.掌握构造函数的优化策略. 3.创建对象的方式. 1.创建对象的三种方式: <!....方法名=function() { //输出内容 } let 对象名=new Object(); 对象名.属性; 对象名.方法名(); //第二种方式: let 对象名={}; 对象名.属性名=属性;...对象名.方法名=function() { 输出内容 } //第三种方式: let 对象名={ 属性名:属性值, 方法名:function() { 输出内容 } }; 总结: 记住,对象有属性&&方法才能叫做对象...方法是对象调用的 效果: ? 工厂函数 <!...1.调用对象是一样的,比如我爱你。他也爱你.是不是爱的是一个人啊。 2.调用构造函数是不一样的,为什么,因为他是类中的。类是一个整体不是个体啊. 效果: ? <!

    6.8K10

    使用Firefox轻松调试JS

    Firefox调试JS的功能真的很不错,推荐一下! 在页面上点击右键,再点击“查看元素”,如图: ? 就会弹出Firefox的开发者界面,点击“调试器”,如图: ?...一步步调试代码 你可以一步步的执行代码。这对代码调试非常有用。 ? 使用断点调试 断点调试可以终止代码的执行,你可以通过指定代码范围来查看错误是不是在指定代码范围内。这对于 错误调试很有用。...Firefox的JS调试功能非常强大,感觉试一下吧! 点击调试器tab页,刷新要调试的页面,调试器主窗口会出现要调试的代码 ?...点击暂停按钮,点击后按钮状态改变,同时右边的三个调试步骤变为可操作状态,调试步骤的作用可参考IE浏览器javascript调试篇的讲解。同时,在代码行上面打断点。...点击hrefs 变量,可以看到该集合属性的各对象,三个对象均为超链接,跟IE浏览器调试时看到的基本相同。 ? 点击第一个对象对象展开后会出现对象属性信息等内容 ?

    6K20
    领券