精品国产三级A∨在线,猫咪av成人永久网站在线观看

Firebug是由Joe Hewitt開發(fā)的、基于Firefox的一個擴展，是目前最好的Web開發(fā)調(diào)試工具。它可以在客戶端實時編輯、調(diào)試和檢測任何頁面的CSS、HTML和JavaScript。

firebug為你的 firfox 集成了瀏覽網(wǎng)頁的同時隨手可得的豐富開發(fā)工具。你可以對任何網(wǎng)頁的 CSS、HTML和 JavaScript 進行實時編輯、調(diào)試各監(jiān)控。

firebug用于剖析Web頁面內(nèi)部的細節(jié)層面的工具。
FirebugHTML查看和編輯、Javascript控制臺、網(wǎng)絡(luò)狀況監(jiān)視于一體，可以說是web開發(fā)人員必備擴展之一。

用Firebug處理CSS：

當(dāng)CSS盒子之間沒有正確的對齊的時候，可能很難找到原因。這時候可以用Firebug來測量一下盒子的偏移、外邊距（margin）、內(nèi)邊距（padding）以及大小（size）。玩CSS，離不開它！

在DOM標(biāo)簽中，每個HTML元素的style屬性揭示了該元素的所有CSS設(shè)置。你可以雙擊對這些設(shè)置進行編輯。

對于那些Firefox不支持的CSS規(guī)則，F(xiàn)irebug會自動隱藏。比如，F(xiàn)irebug會隱藏針對某些瀏覽器的CSS特定設(shè)置，以及一些它不支持的CSS3規(guī)則。所以，它會隱藏_height:25px;（下劃線是一個針對IE6的設(shè)置）和p:first-of-type {color: #ff0000;} (:first-of-type是一個CSS3規(guī)定的偽類，目前只有Safari 3支持）。但是，這也意味著，如果你恰巧發(fā)生了打字錯誤，導(dǎo)致某些規(guī)則無法顯示，那么你只有使用其他編輯器顯示全部CSS內(nèi)容，找到你的錯誤。

Firebug允許你關(guān)閉CSS中的某些語句，頁面會立刻反映相應(yīng)變化，你可以立刻查看效果。"關(guān)閉"一條語句的方法是，在該語句的左邊點擊，會出現(xiàn)一個紅色的禁止標(biāo)志。該語句就會變灰。再次點擊，該語句就會恢復(fù)。

Firebug允許你編輯CSS的屬性和屬性值。你只要對它們點擊，就能編輯。修改后的效果會立刻在瀏覽器窗口中顯示出來。這個特性最好的運用，是在確定準確定位的padding和margin時，firebug允許你用方向鍵逐單位的增加。

Firebug允許你增加新的屬性和屬性值。增加方法是雙擊現(xiàn)有的selector，然后就會出現(xiàn)一個空白的屬性名輸入框，完成輸入后則會出現(xiàn)一個空白的屬性值。

DOM

DOM標(biāo)簽提供頁面上所有物體的所有屬性的信息。Firebug最酷的功能之一是，它可以動態(tài)修改頁面，反映在瀏覽器窗口，但是如果使用瀏覽器自帶的查看源碼功能，你會發(fā)現(xiàn)源碼并沒有改變。

Javascript調(diào)試：

JavaScript profiler可以報告你的Javascript函數(shù)執(zhí)行所花的時間，因此你可以查看不同函數(shù)對速度的影響。使用這個功能的方法是，打開console標(biāo)簽，然后點擊上面的Profile按鈕（上部的按鈕順序是"Inspect |Clear | Profile"）。Firebug列出調(diào)用的所有函數(shù)，及其所花的時間。你可以針對要測試的某個函數(shù)，在其前部加上console.profile([title])，在其后部加上console.profileEnd()。

console標(biāo)簽的底部是命令行輸入，它以">>>"開頭。如果命令行輸入有結(jié)果輸出，那么它會展示在上部的窗口。有一個詳細的命令行輸入API值得看一下。Firebug內(nèi)置console對象有幾種有用的方法可供調(diào)用，包括console.debug、console.info、console.warning、console.error等。如果這些方法產(chǎn)生了輸出結(jié)果，F(xiàn)irebug會提供一個鏈接，讓你查看相應(yīng)的代碼。

調(diào)試的另一個方法是設(shè)置斷點。Script標(biāo)簽允許你在任意行暫停執(zhí)行。單擊行號，就會設(shè)置一個斷點。右擊行號，就可以設(shè)置一個斷點出現(xiàn)的條件，只有當(dāng)條件為真時，程序才會暫停執(zhí)行。右面還有一個watch窗口，可以查看當(dāng)前變量的值。

AJAX：

前面已經(jīng)提到，F(xiàn)irebug可以捕捉頁面的動態(tài)內(nèi)容和其他DOM變化。如果你打開這個示例文件，點擊頁面上的鏈接后，在瀏覽器中查看源碼，你會發(fā)現(xiàn)什么也沒有改變，源碼中依然包含那個鏈接。但是，如果你在Firebug中查看源碼，你會發(fā)現(xiàn)DOM已經(jīng)發(fā)生了變化，"Hello World"已經(jīng)被包括在內(nèi)了。這就是Firebug的核心功能之一，沒有它，AJAX的請求和回應(yīng)就是不可見的。有了它，你可以看到送出的和收到的文本，已經(jīng)相應(yīng)的頭信息。在Net標(biāo)簽中，你還能監(jiān)控每個請求/回應(yīng)各自所花費的時間。

Net標(biāo)簽中的XHR功能，對查看AJAX操作特別有用。如果你點擊每個服務(wù)器端回應(yīng)前的加號，你就會看到服務(wù)器端回應(yīng)的頭信息和內(nèi)容。

當(dāng)通過XMLHttpRequest對象向服務(wù)器端發(fā)出一個請求時，F(xiàn)irebug會記錄請求的POST或GET內(nèi)容，以及回應(yīng)的頭信息和內(nèi)容。使用Net標(biāo)簽中的XHR功能，就可以看到這些內(nèi)容。它會列出所有服務(wù)器的回應(yīng)，以及所花費的時間。點擊前面的+號，如果是GET請求，會顯示三個標(biāo)簽；如果是POST請求，會顯示4個標(biāo)簽：

Params: 顯示請求URL中所包含的name/value對。

Headers: 顯示請求和回應(yīng)的頭信息。

Response: 顯示實際從服務(wù)器收到的信息。

Post：顯示從通過POST請求，送到服務(wù)器的信息。（此項GET請求不包括。）

這四個標(biāo)簽對編寫和調(diào)試程序很有用。檢查POST和Params標(biāo)簽，確定你的請求被正確地發(fā)出了。檢查Response標(biāo)簽查看返回的格式，確定相應(yīng)的Javascript處理函數(shù)應(yīng)該如何編寫。