linux 怎么调试 js,JavaScript程序设计之JS调试_javascript技巧

本文主要通过一个加法器,介绍JS如何调试。先上代码:

效果:

997bc665f5dac027ac49ea58d41a60c8.png

test.html:

计算器

计算器

+

=

计算

demo.js

/**

* Created by yanzi on 15/12/8.

*/

var num1 = document.getElementById("num1"),

num2 = document.getElementById("num2"),

result = document.getElementById("result"),

btn_add = document.getElementById("add");

btn_add.addEventListener("click", onAddClick, false);

function onAddClick(){

var a = parseInt(num1.value),

b = parseInt(num2.value);

var sum = add(a, b);

result.innerHTML = sum;

}

/**

*

* @param a

* @param b

* @returns {*}

*/

function add(a, b){

return a+b;

}

重点摘要:

1、一般调试JS,打印信息有如下三种:

a.用alert,缺点是每次都弹框

b.用console.log,这个数据量小还可以

c.加断点调试

2、在JS里,如果变量前面加var,表示局部变量,function里如果不带var表示全局变量。因此一般情况下变量前面带var.

3、一般在chrome调试器里,elements看代码,在source目录下进行调试。在该模式下,点击js里每一行即可以加断点。

baf38c5af21e95da29b2fb60f543468e.png

4、调试模式下最右边的四个按钮分别是:下一个断点处,单步执行,进到下一函数,跳出函数。基本所有的调试工具都有这四种。

3405edfdbabf9146eb5fdf608bb89db4.png

5、断点模式下,在console里输入变量就可以看到当前值,同时可以随意对值进行修改。

06d16162f5f24896f167d2ace8b01d18.png

以上就是js调试的具体步骤,希望大家在javascript程序设计时会使用js进行调试,谢谢大家的阅读。

声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理

相关标签:js 调试

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值