JavaScript程序設(shè)計之JS調(diào)試

本文主要通過一個加法器，介紹JS如何調(diào)試。先上代碼：

效果：

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;

}

重點(diǎn)摘要：

1、一般調(diào)試JS，打印信息有如下三種：

a.用alert，缺點(diǎn)是每次都彈框

b.用console.log，這個數(shù)據(jù)量小還可以

c.加斷點(diǎn)調(diào)試

2、在JS里，如果變量前面加var，表示局部變量，function里如果不帶var表示全局變量。因此一般情況下變量前面帶var.

3、一般在chrome調(diào)試器里，elements看代碼，在source目錄下進(jìn)行調(diào)試。在該模式下，點(diǎn)擊js里每一行即可以加斷點(diǎn)。

4、調(diào)試模式下最右邊的四個按鈕分別是：下一個斷點(diǎn)處，單步執(zhí)行，進(jìn)到下一函數(shù)，跳出函數(shù)。基本所有的調(diào)試工具都有這四種。

5、斷點(diǎn)模式下，在console里輸入變量就可以看到當(dāng)前值，同時可以隨意對值進(jìn)行修改。

以上就是js調(diào)試的具體步驟，希望大家在javascript程序設(shè)計時會使用js進(jìn)行調(diào)試，謝謝大家的閱讀。相關(guān)閱讀:

JS實(shí)現(xiàn)一個按鈕的方法

從數(shù)組中隨機(jī)取x條不重復(fù)數(shù)據(jù)的JS代碼

asp.net上傳圖片并作處理水印與縮略圖的實(shí)例代碼

使用Get方式提交數(shù)據(jù)到Tomcat服務(wù)器的方法

js判斷當(dāng)前頁面用什么瀏覽器打開的方法

android檢測網(wǎng)絡(luò)連接狀態(tài)示例講解

jquery showModelDialog的使用方法示例詳解

C#編寫ActiveX網(wǎng)頁截圖控件

JS動態(tài)增加刪除UL節(jié)點(diǎn)LI及相關(guān)內(nèi)容示例

AJAX和JSP混合使用方法實(shí)例

PHP上傳圖片進(jìn)行等比縮放可增加水印功能

MAC系統(tǒng)iTunes清理iOS備份文件增大磁盤空間的方法

淺談C語言編程中的布爾bool數(shù)據(jù)類型

CSS實(shí)現(xiàn)背景透明文字不透明兼容各種瀏覽器有圖有真相

總結(jié)

以上是生活随笔為你收集整理的JS在html中加法器,JavaScript_JavaScript程序设计之JS调试，本文主要通过一个加法器，介 - phpStudy...的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。