chromedevelopertool調(diào)試技巧

這篇文章是根據(jù)目前chrome穩(wěn)定版(19.0.1084.52 m)寫的，因?yàn)?google 也在不斷完善chromedeveloper tool，所以chrome版本不同可能稍有差別. 一些快捷鍵也是 windows 上的，mac 下的應(yīng)該大同小異。

成都創(chuàng)新互聯(lián)公司是一家集網(wǎng)站建設(shè),湛江企業(yè)網(wǎng)站建設(shè),湛江品牌網(wǎng)站建設(shè),網(wǎng)站定制,湛江網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營銷,網(wǎng)絡(luò)優(yōu)化,湛江網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競爭力?？沙浞譂M足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專業(yè)、時(shí)尚、前沿，時(shí)刻以成就客戶成長自我，堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。

常規(guī)的斷點(diǎn)相關(guān)的 breakpoint/conditional-breakpoint/call-stack/watch-expressions 等就不涉及了。

1. BeautifyJavascript

js 文件在上線前一般都會壓縮下，壓縮的 javascript 幾乎沒有可讀性，幾乎無法設(shè)定斷點(diǎn). 在 Scripts 面板下面有個 Pretty print 按鈕(這種符號 {})，點(diǎn)擊會將壓縮 js 文件格式化縮進(jìn)規(guī)整的文件，這時(shí)候在設(shè)定斷點(diǎn)可讀性就大大提高了。

2. 查看元素綁定了哪些事件

在 Elements 面板，選中一個元素，然后在右側(cè)的 Event Listeners 下面會按類型出這個元素相關(guān)的事件，也就是在事件捕獲和冒泡階段會經(jīng)過的這個節(jié)點(diǎn)的事件。

在 Event Listeners 右側(cè)下拉按鈕中可以選擇 Selected Node Only 只列出這個節(jié)點(diǎn)上的事件

展開事件后會顯示出這個事件是在哪個文件中綁定的，點(diǎn)擊文件名會直接跳到綁定事件處理函數(shù)所在行，如果 js 是壓縮了的，可以先 Pretty print 下，然后再查看綁定的事件。

3.Ajax 時(shí)中斷

在 Scripts 面板右側(cè)有個 XHR Breakpoints，點(diǎn)右側(cè)的 + 會添加一個 xhr 斷點(diǎn)，斷點(diǎn)是根據(jù) xhr 的 url 匹配中斷的，如果不寫匹配規(guī)則會在所有 ajax，這個匹配只是簡單的字符串查找，發(fā)送前中斷，在中斷后再在 Call Stack 中查看時(shí)那個地方發(fā)起的 ajax 請求

4.頁面事件中斷

除了給設(shè)定常規(guī)斷點(diǎn)外，還可以在某一特定事件發(fā)生時(shí)中斷(不針對元素) ，在 Scripts 面板右側(cè)，有個 Event Listener Breakpoints，這里列出了支持的所有事件，不僅 click，keyup 等事件，還支持 Timer(在 setTimeout setInterval 處理函數(shù)開始執(zhí)行時(shí)中斷)，onload，scroll 等事件。

5.Javascript 異常時(shí)中斷

Pretty print 左側(cè)的按鈕是開啟 js 拋異常時(shí)中斷的開關(guān)，有兩種模式：在所有異常處中斷，在未捕獲的異常處中斷. 在異常處中斷后就可以查看為什么拋出異常了。

網(wǎng)頁題目：chromedevelopertool調(diào)試技巧
分享路徑：http://muchs.cn/article10/cjjigo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供全網(wǎng)營銷推廣、網(wǎng)站制作、手機(jī)網(wǎng)站建設(shè)、網(wǎng)站導(dǎo)航、網(wǎng)站設(shè)計(jì)、Google

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)