-
Grid布局中不能直接对grid-template-rows/columns使用transition，因为这些属性无法插值计算中间状态，导致无平滑过渡；解决方法是通过transform、opacity等可动画属性作用于子元素，结合transition实现视觉上的网格动效，例如利用translate实现位置滑动、opacity与visibility控制显隐，再配合ResizeObserver响应尺寸变化，从而达成流畅的界面动画效果。
-
浏览器原生拖放API需在dragover时调用preventDefault()才能触发drop；自定义数据应通过ID映射表安全传递；排序时优先用elementFromPoint判断位置；移动端应降级或使用interact.js等库。
-
WKWebView加载file://本地HTML时localStorage默认禁用，需改用本地HTTP服务（如GCDWebServer）托管HTML并访问http://localhost:8080，方可启用localStorage等Web存储API。
-
width:auto和height:auto不触发响应式缩放，仅恢复默认尺寸计算；SVG应用viewBox+width+height:auto实现等比缩放；位图需object-fit配合固定容器；避免HTMLwidth/height属性覆盖CSS。
-
使用百分比宽度、flex布局和媒体查询可实现输入框自适应；设置max-width防止过宽，并通过@media优化小屏体验，结合flex-wrap实现多列响应式换行，确保表单在不同设备均良好显示。
-
ECharts是成熟开源图表库，支持Canvas渲染、2D/3D、响应式与交互；推荐模块化引入，初始化需四步：准备容器、init实例、配置option、setOption渲染；支持动态更新、事件监听与resize响应。
-
不能。transition仅在起始和结束状态间插值，方向由transform的起始/结束值决定，如translateX(-100px)→translateX(0)为左进；需确保起始态明确且函数类型一致，否则动画失效。
-
应使用CSSfont-family属性指定字体族或@font-face引入外部字体，避免废弃标签和内联font；需提供通用字体兜底，注意中文字体引号、跨平台顺序及加载验证。
-
使用:first-child、:last-child和:nth-child可精准控制元素样式，如导航栏首尾去边距、表格前两行变色、排除首尾添加边框、奇偶行交替背景等，提升页面视觉层次与可读性。
-
autoplay需配合muted和playsinline才生效，缺一不可；iOS还需playsinline防全屏中断；JS需监听canplaythrough后调用play()并catch异常；视频编码、响应头及CDN策略也影响自动播放。
-
IndexedDB是浏览器内置的NoSQL数据库，支持异步、事务型操作，适合存储大量结构化数据。它提供大容量存储、高效索引查询和事务一致性，优于localStorage的同步小容量限制，适用于离线应用与大规模缓存场景。
-
JavaScript的OOP基于原型，ES6的class是语法糖；用class定义类，constructor初始化属性，方法写在类体中；支持公有字段、static静态成员；继承用extends和super()；所有方法仍在prototype上，原型链未变。
-
Chrome检测HTML5元素支持需用document.createElement模拟创建并检查特有属性或方法，如canPlayType、getContext、contentEditable等；语义标签用'classList'in判断；Modernizr可批量检测，但注意其返回的是能力而非完整兼容性。
-
npm和Yarn通过package.json解析依赖，采用扁平化策略安装包，利用lock文件确保版本一致，处理版本冲突时选择兼容版本或嵌套安装，YarnBerry则使用PnP提升性能。
-
ES6+通过let/const实现块级作用域，解决变量提升与循环闭包问题；箭头函数简化回调并固化this指向；解构赋值高效提取数据，模板字符串便捷拼接文本，广泛应用于Vue、React、Node.js等现代开发场景。
