js除錯技巧

最近使用js進行一些開發工作,整理一下最近接觸的前台除錯技巧.

在瀏覽器的開發者工具中(大部分瀏覽器都可以使用f12快捷鍵),在console頁籤中使用以下**就可以得到控制項觸發的函式方法名稱和相關資訊.

$._data ? $._data( $("#button"), "events" ) : $.data( elem, "events", undefined, true );

//

jquery獲取元素繫結的事件
function
findevents (elem) 
var event = findevents($("input:first")[0]); //
獲取繫結的事件
event.click[0].handler//
得到繫結的事件名稱

下圖是我自己測試的例子的截圖,這裡顯示我在這個控制項上繫結了乙個匿名的函式,點選後就可以跳轉到你編寫此**的檔案中去,這樣就很方便去讀取別人的**或者除錯ajax跳轉的**了

js中函式也是乙個物件,對這個物件使用tostring()方法就可以看到該函式的源**,這也算是乙個小技巧吧,截圖如下:

對於自己寫的js,如果比較複雜的話,我們總希望能動態的看到每一步的執**況,這時候就可以使用斷點除錯功能了.

首先,在需要除錯的js方法合適的位置加入debugger;

然後,執行js並開啟瀏覽器的開發者模式;

這時候如果執行到有debugger的地方,**就會停下來,然後使用除錯快捷鍵進行除錯,本人使用火狐瀏覽器進行除錯,除錯按鈕位置截圖如下,不同瀏覽器的檢視位置有可能不同,但大體應該差不多,這裡就不多說了.

這裡 暫停(f8),跨越(10),步進(f11)和步出(shift+f11)等按鈕就可以進行相應的除錯了.另外也可以在**左側行號的位置新增斷點,這種方式會方便一點.

JS除錯技巧

我們在除錯 時，往往追求優雅而高效的寫 所以就出現了一系列除錯 的方法。這兒根據我的實際遇到的來講講這些除錯方法。1 alert 不推薦使用 不推薦使用的除錯方法，那我為啥放第乙個呢，因為這是初學者剛接觸js時的必經之路。優點 初學者入門 說笑了，現在來看，這個方法幾乎沒有啥優點 缺點 1 aler...

前端js除錯技巧

不管動態載入的js ajax 還是普通的js檔案，對於ie而言，都可以通過 debugger 段進行斷點除錯.對於 chrome 而言，對於普通的js檔案的話需要使用 debugger 但是對於動態載入的指令碼的話，需要在動態載入的js檔案頂部新增標識 sourceurl name,name 自定義...

js除錯技巧和快捷鍵

一 逐語句執行 或者 逐步執行 按鈕 1 意思就是，每點選它一次，js語句就會往後執行一句 2 快捷鍵f10 二 逐過程執行 按鈕 1 常用在乙個方法呼叫多個js檔案時，涉及到的js 比較長，則會使用到這個按鈕 2 快捷鍵f8 三 console控制台 1 這個就是乙個js解析器，是瀏覽器本身用來解...