谷歌chrome瀏覽器有幾種開發(fā)工具?chrome開發(fā)者工具使用教程

Google Chrome開發(fā)者工具我想是Web編程的程序員都不會不知道,以前小編習慣使用火狐的開發(fā)者工具,因為覺得fireBug不錯;但是后邊就覺得不好用了,還經??ㄋ?,網上流傳firebug一個大師跳槽到了谷歌,所以就改用谷歌了,下邊詳細介紹一下Google Chrome開發(fā)者工具的使用
只要安裝了谷歌瀏覽器,就可以使用Google Chrome開發(fā)者工具了,Google Chrome開發(fā)者工具是內嵌到瀏覽器的開發(fā)工具。
打開方式有兩種:第一“按F12”,第二:shift+ctrl+i
一、Console介紹
Console可以查看網頁運行后提示的消息,錯誤或者警告以及輸出內容等,網頁后臺可以使用Console.debug("輸出內容");來在Console輸出顯示,可以做到調試的作用吧,不過一般真正調試不是拿Console。console.debug("Console使用介紹");console是小寫形式,不然提示沒有Console
二、Resources介紹
Resources里可以查看web程序跑起來后所加載的一些資源(Resources),包括圖片或者其他“值”,以及Cookies
三、Sources介紹
Sources可以查看運行的腳本,調試一般都是在Sources調試的,所以程序開發(fā)者需要了解和熟悉Sources的使用
四、Sources調試使用
在左側的腳本代碼編號,鼠標點擊即可添加斷點,添加斷點后,刷新網頁,程序運行到斷點即可看到斷點調式的狀態(tài)了,具體調試需要在自己想查看某個方法里邊是否有問題,一步步排除,效果很好
五、NetWork介紹
NetWork可以看到網頁加載的腳本和資源的時間,還可以看到某些不能加載成功的資源;這里有位是百度首頁演示,百度首頁內容很干凈所以不需要加載什么圖片等資源
六、Elements介紹
Elements這個就比如頁面的每個元素吧,比如百度搜索這個圖片,可以通過Elements找到,搜索框也可以,在底下的“放大鏡”類似的控件,點擊然后選擇自己想要查看要素或位置,Elements會跳轉到相應的實現(xiàn)代碼
注意事項:谷歌瀏覽器建議使用Ctrl+R刷新頁面,可以將修改的js和html代碼無誤快速更新。
相關推薦:
升級chrome谷歌瀏覽器后導致中國銀行網銀插件失效該怎么辦?
相關文章
- 谷歌Chrome瀏覽器怎么下載安裝Postman插件?因為工作包含測試內容,所以經常使用工具進行對接口的測試,今天需要一款postman插件的工具,該怎么在谷歌瀏覽器中安裝呢?下面2015-10-16
- 谷歌chrome瀏覽器怎么安裝擴展插件?很多的時候我們需要瀏覽器中的一下插件來完成一下工作,該怎么才能給谷歌瀏覽器安裝插件呢?下面我們一起來看看谷歌chrome瀏覽器安裝插2015-10-09
谷歌瀏覽器(chrome)的免費插件時空隧道安裝與使用圖文教程
時空隧道是一款可以每天贈送用戶2個小時的每天免費VPN上網時間,并且還可以通過每天登錄累計這個免費的VPN時間。下面小編就為大家介紹谷歌瀏覽器(chrome)的免費插件時空隧2015-09-02惱火Flash插件 IE/Chrome/Firefox/Opera等如何設置點擊播放?
針對最新0day漏洞,F(xiàn)lash Player緊急發(fā)布更新,更新包括所有平臺(Windows,Mac,Linux)。這次的更新和昨天IE瀏覽器爆出的0day漏洞沒有直接的聯(lián)系,但是都是0day漏洞,在2015-08-11谷歌Chrome瀏覽器無法訪問12306網站購買火車票該怎么辦?
谷歌Chrome瀏覽器12306網站無法購買火車票該怎么辦?在進入12306鐵路火車票官方網站后,點擊新版的網上購買火車票無法訪問,甚至注冊用戶都無法訪問,下面分享解決辦法2015-08-11- Chrome瀏覽器提示下載文件是惡意文件已將其攔截怎么辦?我下載的文件時工作用的,絕對安全,可是下載不下來該怎么辦?下面分享解決辦法,需要的朋友可以參考下2015-06-15
- 微軟在4月份的BUILD 2015開發(fā)者大會上確認,全新的Edge瀏覽器將兼容Chrome插件,而這無疑是Edge最重要的功能。不過現(xiàn)在看來這一功能看來是不能及時在29日那天完工了,可能2015-06-11
微軟斯巴達瀏覽器命名Edge 可兼容Chrome和Firefox插件
在微軟Build 2015大會上,此前代號為“Project Spartan”的微軟新瀏覽器正式被命名為“Microsoft Edge”,下面我們來看看詳細介紹2015-04-30升級chrome谷歌瀏覽器后導致中國銀行網銀插件失效該怎么辦?
升級chrome谷歌瀏覽器后導致中國銀行網銀插件失效該怎么辦?在Chrome 42中,該API會默認關閉,導致支付寶控件、網銀控件不可用,這就是為什么升級完谷歌以后網銀就不可以用2015-04-20Chrome插件(shockwave flash)未響應解決方法
今天小編為大家分享的是Chrome插件(shockwave flash)未響應解決方法,有需要的朋友可以看一下2015-01-14