插件:Firebug擴展插件FireQuery


之前也不知道看了哪篇文章的介紹,在火狐上裝了FireQuery插件,一直沒去注意它 的用途。就只發現在FireBug的HTML Tab下的HTML代碼層次上多了些事件代碼,可以點擊查看對應的綁定事件。最近的一些使用,發現了FireQuery的好處,特別是在測試動態生成 DOM以及數據測試上很是方便。

關於FireQuery的簡介和安裝就不多說了,訪問:http://firequery.binaryage.com/

1. 標簽綁定事件查看

打開Firebug的HTML Tab,在一些綁定了事件的HTML標簽上可以看到一些事件數據:點擊后跳轉到DOM Tab,可以查看對應的一些信息:

2. 查看jQuery的.data()函數添加的數據

jQuery的.data()函數是用來給HTML上添加數據的,一般用在插件或數據處理上。一般情況下執行了.data()后,無法確認是否給該 標簽正確地綁定了數據。此時通過FireQuery就可以查看,同樣支持點擊后跳轉到DOM Tab查看,這在給HTML標簽綁定一些對象數據時非常實用。[下圖中黃色counter=33為data數據]

 

 

 

 [你可簡單測試這個:

 

  <script src="jquery-1.4.2.js" type="text/javascript"></script>
  <script type="text/javascript">
     $(document).ready(function(){
        $("p").data('ak',50)
     });
  </script>
  <p>If you click on me, I will disappear.</p>

 

]

3. 引入jQuery.Lint.js對頁面代碼測試

在Console Tab的下拉菜單中啟用引入,重新刷新頁面后會動態地引入jQuery.Lint.js插件,此時對頁面中出現的錯誤進行輸出提示。

FireQuery對於前端開發和測試來說絕對是一大助手,更多的好處還是在實際中可以體會出來。

官方測試頁面:http://firequery.binaryage.com/test


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM