【調試】如何使用javascript的debugger指令進行調試(重要)

2022-12-19 00:09:02

首先安裝firebug，在firefox的擴充裡搜尋安裝即可。

然後在頁面中啟用firebug中的腳本：

然後在網頁某些位置加入debugger指令，比如如下頁面代碼：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>js彈出新視窗</title>
<script type="text/javascript">
    function open_new(obj){
        debugger;
        window.open(obj.href,'search','width=400,height=300,left=500,top=500,scrollbars,resizable');
    }
</script>
</head>
<body>
    <a href="http://www.baidu.com" onclick="open_new(this);return false;">
    go to baidu to search！
</a>
</body>
</html>

在滑鼠單擊連結時，會執行open_new()函數，而該函數中含有debugger指令，是以會在這個地方中斷下來。你可以停下來檢視一些變量的值，或選擇繼續執行。

debugger也可以在斷點處檢視參數的值:(谷歌浏覽器下檢視---谷歌浏覽器更友善調試)

例如:

function beforeRemove(treeId, treeNode) {
    debugger
    if(confirm("确認删除?")){
        if(treeNode.isParent){
            alert("不能删除非葉子節點");
            return false;
        }
        return true;
    }
}

　　停住之後可以在開發者工具右邊的scope區域檢視局部變量與全局變量。