不管我们开发什么项目,都需要使用调试。后端的调试比较简单。前端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就一步一步往下执行代码了。把鼠标停在你要查看结果的代码上(变量)就可以查看到结果。如下图:

IE浏览器如何调试Asp.net的 js代码的更多相关文章

  1. Chrome开发小技巧--浏览器控制台现写并运行js代码--snippets

    想简单等运行一段js代码,以前可能会新建一个html 里面包含script标签,或者引入一个js,然后chrome浏览器打开.这样很麻烦. 想再console控制台写,也不方便,换行处理麻烦. 基于在 ...

  2. 兼容IE,Firefox,Opera等浏览器的添加到收藏夹js代码实现

    function AddToFavorites() { var title = document.title; var url = location.href; if (window.sidebar) ...

  3. 如何使用Fiddler调试线上JS代码

    大家平时肯定都用过火狐的Firebug或者谷歌的调试工具来调试JS,但遗憾的是我们不能像编辑html,css那样来直接新增或者删除JS代码. 虽然可以通过调试工具的控制台来动态执行JS代码,但有时候却 ...

  4. 最新的JavaScript核心语言标准——ES6,彻底改变你编写JS代码的方式!【转载+整理】

    原文地址 本文内容 ECMAScript 发生了什么变化? 新标准 版本号6 兑现承诺 迭代器和for-of循环 生成器 Generators 模板字符串 不定参数和默认参数 解构 Destructu ...

  5. 本地修改js代码并时时生效的解决办法

    js作为客户端语言(当然它也可以作服务端语言),非常强悍,一般情况下,我们都是在开发阶段不停的改,然后上线之后就作为稳定运行的代码. 然而有时候可能因为js写得有问题,导致上线后,某些功能无法使用,这 ...

  6. 最新的JavaScript核心语言标准——ES6,彻底改变你编写JS代码的方式!

    原文地址 迁移到:http://www.bdata-cap.com/newsinfo/1741515.html 本文内容 ECMAScript 发生了什么变化? 新标准 版本号6 兑现承诺 迭代器和f ...

  7. js数组特定位置元素置空,非null和undefined,实现echarts现状图效果;谷歌格式化压缩js代码

    一.想要实现eCharts线状图表的断点效果,如图(后来又查到数据格式为data:['-', 2, 3,'-' , 5, 6, 7]:也可以断点显示) 这种效果,在设置数据的时候应该是这样: data ...

  8. js代码的执行顺序及运算

    代码执行顺序:从上往下,一行一行的执行(也叫一个模块一个模块的执行) 变量的提升(它不是变量的功能,而是浏览器的功能) js代码如何执行? js代码执行前,浏览器会给他一个全局的环境 叫window, ...

  9. 使用浏览器,调试js代码

    1:创建html网页和js文件 <!doctype html> <html> <head> <meta charset="utf-8"&g ...

随机推荐

  1. ElasticSearch 2 (30) - 信息聚合系列之条形图

    ElasticSearch 2 (30) - 信息聚合系列之条形图 摘要 版本 elasticsearch版本: elasticsearch-2.x 内容 聚合还有一个令人激动的特性就是能够十分容易地 ...

  2. 查看django版本的方法

    在cmd输入: python -m django --version django-admin --version

  3. func_get_args()在php71与php56的区别

    func_get_args() 获取函数的所有参数,返回一个数组 官方:http://www.php.net/manual/en/function.func-get-args.php 但是此函数在ph ...

  4. 6 vue-cli mock数据

    https://www.cnblogs.com/dengxiaolei/p/7338773.html //--------------------------------------const por ...

  5. C#中几种创建对象的方式的对比

    最近学习了msil,发现了很多好玩的,今天介绍一个用IL来创建对象的方式 1.最常见的两种创建对象方式 public static T Create<T>() where T : new( ...

  6. 实体框架自定义代码优先约定(EF6以后)

    仅限EF6仅向前 - 此页面中讨论的功能,API等在实体框架6中引入.如果您使用的是早期版本,则部分或全部信息不适用. 使用Code First时,您的模型是使用一组约定从您的类计算的.默认的Code ...

  7. 深入理解ajax系列第六篇——头部信息

    前面的话 每个HTTP请求和响应都会带有相应的头部信息,其中有的对开发人员有用.XHR对象提供了操作头部信息的方法.本文将详细介绍HTTP的头部信息 默认信息 默认情况下,在发送XHR请求的同时,还会 ...

  8. (转)JDK1.8新特性Lambda表达式

    https://www.cnblogs.com/franson-2016/p/5593080.html Predicate predicate接收一个变量,并返回一个boolean值,predicat ...

  9. 【USACO 1.4】Combination Lock

    /* TASK:combo LANG:C++ URL:http://train.usaco.org/usacoprob2?a=E6RZnAhV9zn&S=combo SOLVE:自己做,想的是 ...

  10. BZOJ5093 [Lydsy1711月赛]图的价值 【第二类斯特林数 + NTT】

    题目链接 BZOJ5093 题解 点之间是没有区别的,所以我们可以计算出一个点的所有贡献,然后乘上\(n\) 一个点可能向剩余的\(n - 1\)个点连边,那么就有 \[ans = 2^{{n - 1 ...