不管我们开发什么项目,都需要使用调试。后端的调试比较简单。前端js调试稍微复杂了一点,但是也别怕,因为我们有很多调试前端js代码的浏览器工具。比如IE浏览器、firefox浏览器、chrome浏览器等。用哪个浏览器进行调试看个人习惯。小编习惯用IE浏览器。下面小编讲讲如何使用IE浏览器调试Asp.net的 js代码。

工具/原料

  • IE浏览器、VS2012

方法/步骤

  1.  

    首先编写要实现的功能代码。如下图:前端代码(下图1)、后端代码(下图2)

  2.  

    然后运行页面。普通运行或者调试运行都进行IE浏览器调试js。界面如下图:

  3.  

    然后按F12键。调出IE浏览器的F12开发人员工具

  4.  

    然后在F12开发人员工具的左边工具栏里面选择bug臭虫那个选项,右边代码就会出现js代码。如下图:

  5.  

    然后在js代码里面在需要查看值的地方打上断点。如下图:

  6.  

    然后鼠标在点回到界面在界面文本框上输入相应值。并点击“调用后台值”的按钮。(注意:F12开发人员工具界面不能关闭)如下图:

  7.  

    点击按钮后会自动跳转至F12开发人员工具的js代码界面,鼠标光标并停留在第一个打了断点的代码那行。如下图:

  8.  

    然后按F10就一步一步往下执行代码了。把鼠标停在你要查看结果的代码上(变量)就可以查看到结果。如下图:

JavaScript WEB页面调试的更多相关文章

  1. 微信移动端web页面调试小技巧

    技术贴还是分享出来更加好,希望能对一些朋友有帮助,个人博客  http://lizhug.com/mymajor/微信移动端web页面调试小技巧

  2. mobile web页面调试方法

    此文已由作者张含会授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 开发过程问题排查 Chrome Emulation关键词:使用方便 模拟各种设备尺寸.像素比.自定义user ...

  3. 【转】手机web前端调试页面的几种方式

    前言 PC端web页面调试比较容易,这里主要说几种移动端调试的方法,从简单到复杂.从模拟调试到远程调试,大概分为几部分: 1.Chrome DevTools(谷歌浏览器)的模拟手机调试 2.weinr ...

  4. 手机web前端调试页面的几种方式

    前言 PC端web页面调试比较容易,这里主要说几种移动端调试的方法,从简单到复杂.从模拟调试到远程调试,大概分为几部分: 1.Chrome DevTools(谷歌浏览器)的模拟手机调试 2.weinr ...

  5. iOS之safari调试iOS app web页面

    Overview 当下移动端开发过程中大量使用前段H5.js等等技术,而这些web页面的调试在Xcode控制台中不太明了,经常我们移动app运行了就是方法,但是不能显示响应的效果,这时候或许就是已经报 ...

  6. safari 调试iPhone web页面

    safari设置-打开Safari偏好者设置,选中“高级菜单”,在页面最下方看到“在菜单中显示开发菜单”的复选框,在复选框内打钩,这样设置完毕就能在Safari菜单中看到开发菜单了 iPhone 设置 ...

  7. 微信开发之移动手机WEB页面(HTML5)Javascript实现一键拨号及短信发送功能

    在做一个微信的微网站中的一个便民服务电话功能的应用,用到移动web页面中列出的电话号码,点击需要实现调用通讯录,网页一键拨号的拨打电话功能. 如果需要在移动浏览器中实现拨打电话,发送email,美国服 ...

  8. 用Chrome devTools 调试Android手机app中的web页面。

    (1) 手机要满足Android系统为4.4或更高版本,低版本不支持这种方式.(2) 确保App已经开启了webview的debug调试模式,由Android工程师协助.(2) 用usb数据线连接好手 ...

  9. 一天JavaScript示例-判定web页面的区域

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

随机推荐

  1. 转:C/C++程序员简历模板

    https://github.com/geekcompany/ResumeSample/blob/master/c.md 本简历模板由国内首家互联网人才拍卖网站「 JobDeer.com 」提供. ( ...

  2. 【网络】IP地址格式转换(htonl、ntohl;inet_addr、inet_ntoa)

    1.htonl ()和ntohl( ) u_long PASCAL FAR ntohl (u_long netlong); u_short PASCAL FAR ntohs (u_short nets ...

  3. 网上找的Gif图片解析类

    这个是搜到的大部分的答案 下面贴出来代码 public class MyGifView extends View { private long movieStart; private Movie mo ...

  4. flask笔记2-程序的基本结构

    第一个flask web程序 1.初始化(所有flask程序都必须创建一个程序实例,程序实例是Flask类的对象): from flask import Flask app = Flask(__nam ...

  5. 不在折腾---hbase-0.96.2-hadoop2

    首先安装好zookeeper集群 上传hbase安装包 解压 配置hbase集群,要修改3个文件 * 修改hbase-env.sh 设置JAVA_HOME: export JAVA_HOME=... ...

  6. HTML 格式化等处理方法

    1.处理特殊字符串,清除空格,换行等 function DeleteHtml($str) { $str = trim ( $str ); // 清除字符串两边的空格 $str = preg_repla ...

  7. 怎么让我们自己开发的Android程序设为默认启动

    怎么让我们自己开发的Android程序设为默认启动呢?其实很简单,只要在AndroidManifest.xml文件中配置一下首次启动的那个Activity即要. <activity        ...

  8. nodejs学习篇

    最近在找工作,然后都说会个后台语言更好,选来选去,觉得nodejs比较有意思,就开始着手学这个了. 其实个人觉得,没有人领一下或者没有本好书去跟着做,这样的学习实在特别累,像我这种刚入门的菜鸟,完全搞 ...

  9. rtc 关机闹钟1 app层

    private static void enableAlertPowerOn(Context context, final Alarm alarm, final long atTimeInMillis ...

  10. intent参数的回传

    1. public class MainActivity extends Activity { private EditText editText1, editText2, editText3; pr ...