開發人員工具摘要,2016 年 10 月

嗨,Kayce,再次為您摘要說明您上個月以來的開發人員工具的新功能。

Play 管理中心的新功能

在目前搭載 Canary 的 Chrome 56 中,開發人員工具控制台採用 CodeMirror 技術。就能實現許多新功能,例如:

在你輸入內容時醒目顯示語法。開發人員工具先前只能在評估程式碼區塊後醒目顯示語法。

相符括號 / 方括號 / 大括號醒目顯示。如果您有額外的括號、括號或括號,開發人員工具會將其醒目顯示為紅色。

括號不相符

遊標旁邊在括號、括號或大括號旁邊時,括號、括號或括號都會以灰色標示。

相符的括號

智慧回報。輸入多行程式碼區塊時,開發人員工具現在會知道每次按下 Enter 鍵時,是否要建立新行或執行程式碼。舉例來說,假設您想要在主控台中評估下列 for 迴圈:

for (var i = 0; i < 5; i++) {
  console.log(i);
}

過去,如果在輸入第一行後按下 Enter 鍵,開發人員工具就會導致開發人員工具評估該行,進而產生錯誤。如要繼續將程式碼區塊移至新的一行,請按住 Shift 鍵再按下 Enter 鍵。相反地,現在開發人員工具會在您按下 Enter 鍵後,自動接續新的一行程式碼區塊。

多個遊標。按住 Command (Mac) 或 Control + Alt 鍵 (Windows、Linux),然後按一下。

多個遊標

Canary 現在會醒目顯示非頂層背景資訊

如果您最近曾在主控台中處理過,先前將「執行內容選取器」設為 top 以外的值,可能難免有點小錯誤。

這項錯誤現在應該已在穩定版中修正,但為了安全起見,現在初期測試工具 (Chrome 56) 中的開發人員工具會警告您並非顯示在 top 環境中,方法是以紅色醒目顯示選取器。

以紅色標示非頂層內容

新使用者代理程式:UC 瀏覽器

您現在可以在「Network Conditions」(網路狀況) 繪圖分頁中,選取適用於 iOS、Android 或 Windows Phone 的 UC 瀏覽器。

UC 瀏覽器使用者代理程式

分享對我們來說很重要

與往常一樣,我們很樂意聆聽您對開發人員工具的任何意見回饋或想法。

  • 如有簡短的問題或意見,或想分享新的想法,請在 Twitter 上透過 ChromeDevTools 傳送。
  • 如果討論時間較長,郵寄清單Stack Overflow 會是最合適的選擇。
  • 如需任何文件相關文件,請前往我們的文件存放區開啟問題
  • 您隨時可以直接前往我們的團隊回報錯誤或要求 Crbug 功能。

到下個月為止

凱斯