只举例火狐和谷歌.如果是火狐,一般是用firebug,首先确保开启脚本调试:

然后刷新一下要调试的页面,点击firebug中的行内,选择当前页面:

js文件一般直接显示的是js文件的名字,而页面一般是拦截的请求路径,如上图所示请求路径为/login,显示的是login.

选中页面后就可以看到页面的代码了,和打开js文件无异,直接鼠标单击左侧的行号下断点,此时就可以正常的进行调试了,firebug的变量值会在右侧面板显示:

面板中白色区域为当前中断处所在的方法,其中会显示参数和定义的局部变量值.下侧紧挨着的Function为中断处的外层方法,别扭的说法为当前中断处所在方法所在的方法..

以上为firebug调试页面的方法.谷歌与此类似:

如上图选择的Sources面板,谷歌可以直接从项目中选择要调试的页面.选择好后也是直接在行号上点击加断点,之后同firebug.略微不同处是谷歌调试的时候可以实时的将变量的值打印到变量的后面.

使用开发者工具调试jsp页面中的脚本的更多相关文章

  1. 使用微信web开发者工具调试微信企业号页面（前端页面，已发布在服务器上的）

    前几天写了一篇使用fiddler调试微信端页面的,然后博友评论说使用fiddler太麻烦了,推荐使用微信web开发者工具调试微信页面,这两天弄着玩了一下,很强大.这篇文章只是做一个记录,方便自己以后使 ...

  2. 微信web开发者工具调试

    微信web开发者工具调试 前几天写了一篇使用fiddler调试微信端页面的,然后博友评论说使用fiddler太麻烦了,推荐使用微信web开发者工具调试微信页面,这两天弄着玩了一下,很强大.这篇文章只是 ...

  3. 使用eclipse+fiddler+微信web开发者工具调试本地微信页面

    前面已经说了调试服务器上的微信页面,放链接:http://www.cnblogs.com/Gabriel-Wei/p/5977850.html 还有fiddler调试链接:http://www.cnb ...

  4. 使用Chrome开发者工具调试Android端内网页(微信，QQ，UC，App内嵌页等)

    使用Chrome开发者工具调试Android端内网页(微信,QQ,UC,App内嵌页等) 前言 移动端页面调试一直是好多朋友头疼的问题,iOS 由于其封闭的特性和整体较高的性能,整体适配相对好做,调试 ...

  5. Chrome DevTools开发者工具调试

    1-1 Chrome DevTools 功能简介 (九大功能面板) (1)Elements元素面板 检查和调整页面,调试DOM,调试CSS (2)Network网络面板 调试请求,了解页面静态资源分布 ...

  6. 数据库中的记录通过servlet回显到jsp页面中（连接数据库或者查询參照:对数据进行增删改查）

    我们常常会用到通过图书的名称来查询图书那么这种话我们也就会使用到从数据库中搜索出数据而且载入到自己的Jsp页面中 这种话我们须要将从数据库中获取到的数据放进响应中然后通过%=request.getAt ...

  7. 引号在jsp页面中正确显示的处理

    写在前面: 在前面的博客中已经有了对一些特殊字符的处理,但是万万没有想到,出来了一个含有引号的字符串,比如这样的ab"c"d的一个字符串.如果在超链接传值的时候,会与前面的引号成对 ...

  8. 如何使用微信web开发者工具调试企业微信

    最近因工作需要围绕着企业微信来进行调试,从而掏出了我的微信web开发者工具,在进行授权的时候微信web开发者工具成功的提示了我:“您未绑定企业微信开发者权限”.那么关键来了,因为我也百度过,发现也有很 ...

  9. Java项目在jsp页面中引入jquery框架的步骤

    环境:在Java  web项目中引入juqery框架 工具:MyEclipse8.5 [步骤如下] A:新建一个Java web项目TestJquery,在WebRoot目录下创建一个jquery文件 ...

随机推荐

  1. Hibernate —— 检索策略

    一.Hibernate 的检索策略本质上是为了优化 Hibernate 性能. 二.Hibernate 检索策略包括类级别的检索策略.和关联级别的检索策略(<set> 元素) 三.类级别的 ...

  2. Windows下程序启动时出现0xc000007b错误的解决方案

    一.背景介绍 不久前用Qt开发了一款小工具在公司使用,Debug运行时一切正常.可是当Release编译发布打包之后,运行时弹出这样的提示框: 略一思考,首先排除了DLL缺失的可能性.我知道Qt应用程 ...

  3. iOS 视图控制器 （内容根据iOS编程编写）

    视图控制器是  UIViewController 类或其子类对象.每个视图控制器都负责管理一个视图层次结构,包括创建视图层级结构中的视图并处理相关用户事件,以及将整个视图层次结构添加到应用窗口. 创建 ...

  4. Jquery.Qrcode在客户端动态生成二维码并添加自定义Logo

    0 Jquery.Qrcode简介 Jquery.Qrcode.js是一个在浏览器端基于Jquery动态生成二维码的插件,支持Canvas和Table两种渲染方式,它的优点是在客户端动态生成,减轻了服 ...

  5. Effective java笔记（四），泛型

    泛型为集合提供了编译时类型检查. 23.不要在代码中使用原生态类型 声明中具有一个或多个类型参数的类或接口统称为泛型.List<E>是一个参数化类,表示元素类型为E的列表.为了提供兼容性, ...

  6. 针对Asp.net MVC SEO的几点建议

    1. 引言 SEO 即搜索引擎优化,很多web开发人员本应该熟悉,至少需要了解的一个知识点.像百度.必应等搜索引擎其实一直都在进化.但是有些优化的技巧可能在短时间内不变. 今天就给大家介绍几个专门针对 ...

  7. luogg_java学习_07_抽象类_接口_多态学习总结

    这篇博客总结了半天,希望自己以后返回来看的时候理解更深刻,也希望可以起到帮助初学者的作用. 转载请注明 出自 : luogg的博客园 , 抽象 一种专门用来做父类,被继承的. (模板) 格式: abs ...

  8. ABP使用及框架解析系列 - [Unit of Work part.1-概念及使用]

    前言 ABP ABP是“ASP.NET Boilerplate Project”的简称. ABP的官方网站:http://www.aspnetboilerplate.com ABP在Github上的开 ...

  9. ul ol di三者区别

    1.ul是无序列表,也就是说没有排列限制可以随意加li: <ul> <li>可以随意放置</li> <li>可以随意放置</li> < ...

  10. 3D banner(CSS3+HTML5)

    1.这是一篇 3Dbanner制作的简易流程,支持高版本的chrome和firefox浏览器,俩浏览器显示可能会有些差异 2.没有兼容性代码,因为仅仅只是熟悉流程,希望小伙伴们自己改善哈(>﹏& ...