-
try-catch仅捕获同步运行时错误（如ReferenceError、TypeError），无法捕获异步错误；Promise错误需用.catch()或await+try-catch处理；catch应分类处理、记录上下文、友好提示；finally用于清理但不改变错误流向。
-
双击HTML文件能否正常打开取决于默认浏览器设置；Windows需检查并修改文件关联，Mac建议拖入Chrome/Firefox或用终端命令打开；开发时应使用LiveServer等本地HTTP服务避免file://协议限制。
-
:empty伪类用于选择无子元素或内容的元素，可隐藏空提示容器、标识表格空单元格、设置动态内容占位符；需注意其严格判定规则，仅匹配完全空白的元素，含空格、换行或注释均不匹配。
-
Flex转Grid时，父容器必须显式设display:grid并定义grid-template-columns或grid-template-rows，否则网格无结构；子项居中需改用justify-self/align-self或place-items；fr与flex-grow逻辑不同，不可简单对应；justify-content与justify-items作用对象不同；响应式推荐auto-fit+minmax而非多段@media。
-
根本原因是box-sizing默认为content-box，导致padding不包含在100vh内，使总高度超视口而出现滚动条；应改用border-box并配合background-origin:padding-box等设置。
-
MessageChannel是JavaScript中用于跨上下文安全高效双向异步通信的核心机制，通过一对关联的MessagePort实现隔离通信，支持Worker和iframe场景，需调用start()启用、close()关闭，遵循structuredclone序列化规则。
-
内存泄漏在JavaScript单页应用中可能导致性能下降或崩溃。常见类型包括：意外的全局变量、未解绑的事件监听器、闭包引用、定时器回调和DOM引用未释放。使用ChromeDevTools的堆快照、内存分配时间线、DetachedDOM树和Performance面板可定位泄漏。预防策略有：避免全局变量、及时解绑事件和清除定时器、使用WeakMap/WeakSet、框架中正确管理生命周期。通过代码模拟并结合工具验证，可有效发现并解决泄漏问题。关键在于养成定期检查与规范编码的习惯。
-
圣杯布局浮动实现必须用负边距，因浮动元素脱离文档流，中间区设width:100%会被左右栏挤出视口；负边距使中间区预留空间并“拉回”左右栏，结构须为main→left→right，父容器需padding和BFC触发。
-
在Nuxt中，dev属性由CLI命令自动设定（nuxt命令设为true，nuxtbuild设为false），无需手动配置；可通过读取process.env.NODE_ENV安全、可靠地复用该状态来驱动其他配置项。
-
FileReader必须由用户触发（如input[type=file]的change事件）且异步使用，不能自动读取或同步获取结果；需通过event.target.files[0]获取File实例，监听onload/onerror处理结果，每次读取需新建实例。
-
要让::after伪元素始终贴文字底部不动，须设父元素position:relative，::after设position:absolute;bottom:0;left:0;height:2px;bottom:-1px微调对齐，并在默认状态声明width:0和transition:width.3sease。
-
本文详解React组件中因错误使用单引号而非模板字符串（反引号）而导致动态插值失效的问题，并提供修复方案、原理说明及开发注意事项。
-
float元素不能用margin:auto垂直居中，因其脱离文档流，而margin:auto垂直生效需元素处于正常流且有明确宽度；水平居中有效是因浮动后行框内联上下文的特殊计算，但垂直方向margin被忽略。
-
全屏元素应设display:block或flex、position:fixed并绑定top/left/width/height，:fullscreen中显式声明box-sizing:border-box，移动端优先用webkit-playsinline模拟全屏。
-
面板根元素用panel，子元素统一为panel__header/body/footer；状态用panel--collapsed，尺寸修饰符需成套作用于各子元素，body需设flex:1和min-height:0防塌陷。
