1. 程式人生 > >Web前端開發人員實用Chrome插件收集

Web前端開發人員實用Chrome插件收集

dev dai 不同 裏的 png 刪除 ddc .org loj

越來越多的前端開發人員喜歡在Chrome裏開發調試代碼,Chrome有許多優秀的插件可以幫助前端開發人員極大的提高工作效率。尤其Chrome本身是可以登錄的,登錄後你所有的插件都會自動同步到每一個登錄後的Chrome的,非常方便啊。

Postman - REST Client

Postman是Ajax開發的神器,對於Restful開發方式特別有幫助,可以用來模擬各種請求來測試API的正確性,比如用來模擬Ajax請求。它還支持認證,比如簡單的用戶名/密碼,或者Oauth1.0。Rest Console也是一個不錯的選擇。

Edit This Cookie

這是一個強大的cookie管理器。你可以添加、刪除、編輯、搜索、保護和阻止cookies。Cookies也是一個非常強大的Cookie工具。

Web Developer

安裝Web Developer擴展後,會在瀏覽器的工具欄中添加一個按鈕,點擊該按鈕,會彈出各種Web開發工具。此擴展工具的作者同時也是非常流行的Firefox擴展Web Developer extension for Firefox的作者。。

JSON Lint

一個在線驗證和格式化JSON文件的應用。

網頁截圖

截取網頁為圖片,支持窗口截圖,區域截圖和整個網頁截圖三種方式。支持水平和垂直翻頁截取超大網頁,新版引進自動截圖保存功能。截圖後,可以利用圖片編輯工具編輯圖片,然後將編輯後的圖片保存為PNG格式的圖片文件,並且提供了高亮工具,塗改工具和文字添加工具。

YSlow

YSlow可以分析網頁,並為改善網頁性能提出修改建議,這些功能基於高性能網頁的規則集。YSlow可以根據預定義的三個規則集或用戶自定義規則集來對網頁進行分級。,PageSpeed Insights是谷歌開發的類似功能的插件。

ColorZilla

可以從頁面上任何一點獲取顏色,維護獲取歷史等。

Measure It!

MeasureIt! 給你測量一個網站中的任何元素的尺寸(像素寬度和高度)。 Page Ruler也是一個不錯的選擇。

JavaScript Errors Notifier

安裝該擴展後,會在Chrome地址欄中以圖標形式提示JavaScript錯誤,因為Chrome默認只有打開console才會顯示錯誤。

Window Resizer

此擴展可以調整瀏覽器窗口的大小,以適應各種屏幕分辨率。這對於Web設計師和開發者非常有用,可以幫助他們在不同的屏幕分辨率下測試網站布局。

Firebug Lite

Firebug的精簡版允許您檢查的HTML,CSS和JavaScript代碼,生活在任何頁面。 你也可以編輯代碼,立即測試新的變化。 這是一個開發者最喜歡的Firefox擴展Firebug的精簡版。

JQuery 擴展

jQuery擴展讓你在當前網頁中運行JavaScript和jQuery命令。

Pretty Beautiful Javascript

該擴展可以使Javascript文件更容易閱讀。其整合了Beautifier和Prettify的功能,可以為代碼添加語法高亮。用法是在新窗口裏輸入js文件的URL或者在查看HMTL源代碼時點擊js文件的鏈接。如果是在Chrome的控制臺裏的資源選項裏查看代碼則推薦使用Chrome自帶的"pretty print"功能,也就是點擊"{ }"圖標。

WhatFont

用於查看當前頁面使用了哪些字體,Firebug和Webkit Inspector也可以查看字體,但是遠沒有WebFont方便,WebFont可以通過把鼠標懸停在元素上來查看字體。同時還支持查看網絡字體,如Typekit 和Google Font API。

IE Tab

在Chrome中打開IE瀏覽器標簽頁,你可以打開一個標簽來運行Internet Explorer,讓你看到的網頁在IE瀏覽器看起來如何。

參考文獻

10個針對Web開發者的優秀Chrome插件

如需轉載,請註明來自: BorisHuai前端修煉 > Web前端開發人員實用Chrome插件收集

http://blog.csdn.net/linking530/article/details/18141231

Web前端開發人員實用Chrome插件收集