Hacker News | 📄 原文链接 | 2026-10-24 收录

HTML-in-Canvas 开始源测试：把 DOM 画进画布，还能选中、可访问

来源：developer.chrome.com — 2026-10-22

📋 概述

Chrome 开始源测试 HTML-in-Canvas API：给 canvas 加上 layoutsubtree 属性后，可以把 DOM 内容直接画进 2D canvas 或 WebGL/WebGPU 纹理，同时保留全部交互性。好处是把 DOM 的能力搬进画布——多行与双向文字的排版、表单控件、选中复制、右键菜单、可访问性树、页内查找、爬虫与 AI agent 可索引、浏览器扩展与 DevTools 都能直接工作。限制也很明确：不支持跨源 iframe 内容，滚动与动画依赖 JS 主线程。

🔑 核心要点

关键属性是 layoutsubtree，它让浏览器知道 canvas 里嵌套了需要排版和暴露给无障碍树的内容。
DOM 进画布后仍保留：文本选中、复制粘贴、右键菜单、页内 Ctrl+F 高亮到 3D 纹理上。
对 AI 与爬虫友好：渲染进 2D/3D 场景的文字依然可被索引和读取。
两个硬限制：跨源内容不可用；滚动与动画无法脱离 JS 独立更新，性能要自己权衡。

💡 金句

This API lets you draw DOM content directly into a 2D canvas or a WebGL/WebGPU texture while keeping the UI interactable, accessible, and hooked up to your favorite browser features.

← 返回 Hacker News 首页