# Claude Code 在桌面版本上推出了 DOM 元素直接選取功能，相比以往需要用文字描述要修改哪個元件，這個改進顯著降低了操作門檻

> 📖 本站完整內容索引（documentation index）：[llms.txt](/llms.txt)

> 原作者：Lydia Hallie ✨ (@lydiahallie) · 策展與摘要：EasyVibeCoding · 平台：X (Twitter) · 熱度：🔥 · 日期：2026-03-21

> 原始來源：https://x.com/lydiahallie/status/2035088515332284651

## 證據與延伸閱讀

- [Claude Code 桌面版推出 DOM 元素直接選取](https://x.com/lydiahallie/status/2035088515332284651)

## 中文摘要

Claude Code 在桌面版本上推出了 DOM 元素直接選取功能，相比以往需要用文字描述要修改哪個元件，這個改進顯著降低了操作門檻。使用者只需點選欲修改的元素，系統會自動蒐集必要資訊。

**自動蒐集的上下文資訊**

當選取 DOM 元素時，Claude 會自動獲取：
- HTML 標籤和 CSS 類別
- 關鍵樣式設定
- 周圍的 HTML 結構
- 該區域的截圖（用於視覺參考）

React 應用程式則能額外提供原始程式文件、元件名稱和 props 資訊。

**實際優勢**

這項功能透過視覺化選取和完整的上下文資訊，讓 Claude 更精確地理解使用者的修改意圖，避免了模糊的文字描述所造成的誤解。對於前端開發工作流而言，這代表著更直觀、更高效的人工智慧輔助開發體驗。

## 標籤

Claude Code, CLI, 功能更新, Web, Anthropic, Claude