-
点击“展开全文”切换显示状态的核心是用JavaScript控制文本内容与按钮状态，配合data-expanded等属性记录状态，优先服务端提供摘要字段以避免前端DOM解析风险。
-
块级元素水平居中需满足两个前提：必须是块级元素且设置明确宽度，然后使用margin:0auto；若无效，需检查是否浮动、定位或父容器为Flex布局。
-
JavaScript属性的枚举性（[[Enumerable]]）控制其是否在for...in、Object.keys()等遍历中出现：true时可见，false时“隐身”但依然存在；普通添加默认true，Object.defineProperty默认false。
-
并发读取多文件局部字节块本身不直接加速哈希签名，真正提速在于I/O与CPU解耦、多核并行及规避主线程阻塞，关键依赖“分片+Worker+零拷贝”协同。
-
Nunjucks原生不支持{%include"xxx"with{...}%}语法，但可通过自定义render过滤器安全、递归地传递上下文数据，实现类似React的props下传效果。本文详解替代方案、代码实现及关键注意事项。
-
VSCode中按!+Tab可快速生成标准HTML5模板，无需配置，兼容性好、结构干净；而在线生成器常导致冗余代码、性能差和维护难。
-
使用box-sizing:border-box可让宽度包含padding和border，避免浮动元素超出父容器；需统一设置子元素及父容器该属性，并配合百分比宽度实现响应式布局。浮动导致父容器高度塌陷时，应采用clearfix或overflow:hidden触发BFC以清除影响。为防止margin叠加引发换行，建议仅设置单侧外边距并移除最后一个元素的外边距，结合固定padding提升兼容性。通过精确控制盒模型尺寸、合理清除浮动及间距管理，能有效提升浮动布局的稳定性和可维护性。
-
通过检测全局对象区分环境，如用isNode()判断；2.避免使用fs、document等平台特有API；3.用polyfill兼容功能差异，如node-fetch、path-browserify；4.采用ESM并配置package.json支持双模块语法，实现跨平台运行。
-
推荐使用overflow-wrap:break-word解决长单词溢出，它优先保持单词完整，仅在必要时断行；而word-break:break-all会无差别切割，影响可读性。
-
Flex布局通过display:flex启用，核心是主轴与交叉轴的对齐控制。1.flex-direction设置主轴方向（row/column及其反向）；2.justify-content控制项目在主轴对齐（flex-start至space-evenly）；3.align-items定义交叉轴对齐方式（stretch至baseline）；4.align-self允许单个项目覆盖align-items；5.flex-wrap决定是否换行（nowrap/wrap/wrap-reverse）；6.多行时alig
-
用watchEffect实现视频播放自动存档，关键在于通过ref同步currentTime并在watchEffect中读取以触发依赖追踪，结合onInvalidate清理定时器、节流存档、AbortController中止旧请求、时间戳防竞态及isSaving/saveError状态反馈确保可靠性。
-
只加img-fluid无法解决画廊错位、拉伸或留白，因其仅实现单图等比缩放（max-width:100%;height:auto），不控制容器尺寸、不约束裁剪方式、不处理多图间隙；object-fit:cover必须配合明确高度的容器才生效，否则父容器仍被原始图片撑开导致网格塌陷。
-
BackgroundSyncAPI可在恢复网络后自动重试离线提交任务，需HTTPS、激活的ServiceWorker和浏览器支持（Chrome/Edge），通过register()注册、sync事件处理，并配合IndexedDB与幂等设计保障可靠性。
-
Proxy是JavaScript中唯一能拦截并自定义对象基本操作的机制；它通过handler对象定义get、set等拦截函数，需显式实现逻辑，否则透传；无法自动深度代理嵌套对象，且必须用Reflect委托默认行为以避免语义破坏。
-
:scope在CSS文件或<style>标签中完全无效，仅在JS的querySelector等DOM查询方法中有效，且仅指向调用该方法的元素自身；浏览器解析样式表时无运行时上下文，:scope被当作:root处理。
