-
D3.js是数据驱动的SVG可视化库，需手动绑定数据与DOM元素，适合深度定制；通过select、data、enter、attr等方法构建图表，配合scale、axis、transition实现映射、坐标轴和动画。
-
运行HTML文件只需用浏览器打开，无需“瑞香t”等工具；可通过双击、右键选择浏览器、拖拽到浏览器或使用VSCode的LiveServer插件实时预览，配合编辑器与开发者工具提升开发效率。
-
推荐用@layerutilities自定义语义化工具类，如.card、.btn-primary，结合插件机制生成动态样式，保留原生类做响应式微调，兼顾可读性与灵活性。
-
不写<metacharset="utf-8">会导致中文乱码、表单提交乱码、JS字符串处理异常、CSS中文解析失败；该标签须置于<head>最前，且HTML文件本身必须为UTF-8编码（无BOM），否则无效。
-
不推荐用@import统一引入多个CSS文件，因其会阻塞渲染、导致串行加载、不利关键CSS提取；应改用构建工具合并、CSS-in-JS或手动优化。
-
Grid“空行”实为grid-auto-flow:row默认按行填满所致，可通过改用column流向、rowdense回填或约束子项尺寸（如min-width:0、auto-fill列）解决。
-
HTML5中<header>、<nav>、<main>、<section>、<article>、<aside>、<footer>等结构标签必须成对闭合，否则会导致DOM解析异常、CSS失效、无障碍访问受损及W3C验证失败。
-
iPadSafari通过<inputtype="file">触发文件选择器，需确保元素可见可点击、使用HTTPS、真实用户点击且无CSS隐藏或sandbox限制。
-
JavaScript表单验证核心是提交前快速反馈错误以提升体验，但不可替代后端校验；需结合原生API、解耦规则、无障碍支持及前后端协同。
-
JavaScript语音合成基于WebSpeechAPI的SpeechSynthesis接口，支持离线使用；需检测兼容性、监听voiceschanged事件获取音色列表，再创建并配置SpeechSynthesisUtterance实例，通过speak()等方法控制播放，且必须由用户交互触发。
-
答案：构建PWA离线优先应用需以离线为常态设计，通过ServiceWorker预缓存核心资源、采用CacheFirst和Stale-While-Revalidate策略保障静态资源与API可用性，结合IndexedDB持久化数据并维护待同步操作队列，利用BackgroundSync实现网络恢复后自动同步，同时优化UI提示让用户明确感知离线状态与数据暂存情况，配合WebAppManifest和HTTPS实现可安装可靠体验。
-
浏览器中除console.log外，还可使用console.debug/info/warn/error分级日志、console.group/time组织上下文、console.table展示表格、console.dir查看嵌套对象、console.trace追踪调用栈，并可通过封装函数添加时间戳和模块前缀，生产环境通过域名判断动态禁用非error日志。
-
z-index仅对定位元素生效，未定位或陷入父级层叠上下文会导致失效；需先设position（如relative），再设z-index；避免滥用超大值，推荐按功能分层设定合理范围。
-
事件委托是利用事件冒泡机制在父元素统一监听子元素事件，避免为每个子元素重复绑定，提升性能并支持动态元素；应优先用closest()精准匹配目标，避免绑定到document/body，且focus/blur等不冒泡事件需特殊处理。
-
CSSHoudini通过AnimationWorklet和TypedOM开放CSS引擎，支持在独立线程创建高性能动画；利用registerAnimator可实现滚动驱动等复杂交互，结合registerProperty使自定义属性参与原生级动画，提升流畅度与响应性。
