uc瀏覽器開發者工具是款uc瀏覽器官方出品的開發者工具,主要是幫助開發者以及其他使用UC瀏覽器的朋友們便捷性的對于UC瀏覽器進行調試,這里小編提供UC開發者工具的常用調試說明給大家,希望能夠幫到大家
官方簡介
開發者工具(Developer Tool)支持DevTools Protocol,它允許開發者不再需要依賴其他工具進行調試。最低的內核版本要求為U4/2.0。

UC瀏覽器怎么打開開發者工具
打開開發者工具界面有兩個途徑:
1.CTRL+SHIFT+I
2.F12
功能說明
可以捕捉的HTTP協議信息
·文件頭
·內容
·Cookie
·查詢字符串
·提交的數據
·重定向的URL地址
HTTP協議捕捉分析工具
·捕捉HTTP協議數據
·可以提供緩沖區信息
·清理對話內容
·HTTP狀態信息和其他過濾選項
常用調試
1. Screencast
Screencast位于調試界面左上角(Element左側), 即紅框標注的位置。選中Screencast后, 可以在devtools窗口上看到頁面效果, 該區域內支持點擊/長按, 支持鼠標滾輪滾動頁面, 支持鼠標拖動頁面滑動
2. Element
Element可以查看頁面 DOM 樹結構和頁面元素css樣式。
2.1 實時編輯DOM節點和CSS樣式
雙擊DOM樹中的節點,可以實時編輯標簽屬性,修改的效果即刻顯示在瀏覽器中。
點擊右側Style面板,可以實時修改CSS的屬性值,所有樣式的Name和Value都可編輯; 在每個屬性后面單擊可以添加新的樣式。 下圖為增加font-size樣式后, 頁面按新設置的字體大小顯示。
2.2 查看元素監聽的事件
選中節點, 最右側切換到Event Listeners, 即可看到當前節點監聽的所有事件。點擊具體事件, 可以看到該事件所在代碼的位置(格式為”文件名:行號”, 點擊可跳轉到Source中對應代碼的位置)。
3. Console
Console中可以查看頁面出錯信息,執行javascript代碼等。
3.1 輸出頁面出錯日志
內核捕獲頁面執行中的異常, 輸出在console上。 對于出錯日志,左側顯示具體出錯的原因, 右側顯示出錯位置(格式為”文件名:行號”, 點擊可跳轉到Source中對應代碼的位置)。
點擊右側出錯信息所在文件和行號, 例如index.js:253, 即跳轉到對應的js資源中。
3.2 輸出調試日志
通過JS代碼或者命令行console.log()、console.warn()和console.error()可以將日志信息輸出到console。
3.3 執行javascript代碼
在控制臺輸入命令時,會彈出相應的智能提示框,可以用Tab自動完成當前的選項。
通過”$”選擇頁面元素。
3.4 切換context
對于使用了service worker的頁面, 可以在console上切換context (默認是top)。




