您好,登錄后才能下訂單哦!
我總是覺得,有那么多好用的插件呀、軟件呀應該嘗試著去使用,而不是固步自封。我遇到js問題都是用 alert 語句來進行調試,今天呢,想著一起來學習一下3大主流瀏覽器的debugger,以后嘗試使用改變一下。
一、IE上的調試工具
IE 上可選擇的 JavaScript 調試工具不多,主要是 Microsoft 腳本編輯器 (Microsoft Script Editor) 以及 IE Developer Toolbar。
Microsoft 腳本編輯器
Microsoft 腳本編輯器是 Microsoft Office 中的一個小組件,這里我就不做深入研究了。
IE Developer Toolbar
IE Developer Toolbar ,是 IE 上的一個插件,用來探究和理解 Web 頁面的便捷工具,最主要的功能包括: 查看并修改頁面的 DOM 對象;查看選中元素或者標簽的各種屬性,包括 HTML 和 CSS 屬性以及 JavaScript 事件等。
二、在 IE 中啟用腳本調試功能
低版本的IE,需要在 IE 菜單的工具菜單中,取消選中"禁用腳本調試 (Internet Explorer)"和 "禁用腳本調試 ( 其他 )"。如圖:
開啟之后,當IE 碰到 JavaScript 語法及運行時錯誤,IE 會自動彈出一個"實時調試"窗口(被動的)。
我們可以在所要調試的某條語句或者函數中,加入 debugger 語句,這樣當 IE 執行到這個 debugger; 語句時,就會彈出實時調試窗口, 讓我們進行調試(主動的)。
例如:我們簡單寫點代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Debugger Learn</title>
</head>
<body>
<a onclick="ie_debugger()">IE debugger</a>
</body>
<script type="text/javascript">
function ie_debugger(){
var num = 1;
var totalNum = 0;
debugger;
num += num;
total = do_something(num);
alert(total)
}
function do_something(num){
var total = parseInt(num)*36;
return total;
}
</script>
</html>
在IE 瀏覽器中,先按F12打開調試工具,然后點擊觸發function,自動進入debugger。如圖
此調試方法,與IE差不多。不在贅述。如圖:
竟然也和IE類似的操作方法,會了IE基本上也就會其他倆個方式了。可能不同的瀏覽器,呈現的調試內容不盡相同,我又何必一次探究完畢。如圖:
各個瀏覽器,具體的調試方法,在使用的過程中,逐步了解吧。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。