-
JSON是轻量级数据交换格式，非编程语言，语法独立于语言但类似JavaScript对象字面量；要求双引号、无注释、顶层仅object或array；JSON.parse()严格校验，JSON.stringify()忽略undefined/function并丢失类型信息。
-
HTML文字大小本身几乎不影响加载速度，所谓“调文字大小后变慢”多因引入未优化WebFont、触发强制同步布局或滥用内联样式所致；应优先用rem/em/clamp()等相对单位控制，避免px硬编码，并通过DevTools定位真实性能瓶颈。
-
使用CSS的:after伪元素可为元素添加装饰性内容，必须配合content属性，常用于添加图标、气泡箭头或动态提示，提升视觉效果与交互体验。
-
跨域iframe通信必须使用window.postMessage()，发送方调用iframe.contentWindow.postMessage()，接收方监听message事件并严格校验event.origin和event.source；document.domain已基本淘汰；服务端代理或同源中转页可作为补充方案。
-
在CSS中实现数据卡片堆叠的核心方法是使用position属性与z-index属性配合。1.首先为父容器设置position:relative，创建定位上下文；2.为每张卡片设置position:absolute，使其脱离文档流并允许自由定位；3.通过设定不同z-index值控制堆叠顺序，数值越大越靠前；4.使用top和left属性错开卡片位置形成视觉层次；5.当遇到z-index不生效时，需检查元素是否处于同一层叠上下文，并确保设置了非static的position属性；6.可通过CSStransiti
-
ChromeDevToolsMemory面板通过堆快照对比（Comparison视图）定位内存泄漏，重点关注RetainedSize大且持续增长的构造函数；需手动触发GC、用Filter筛选、RevealinConsole查引用链；闭包和未清理的事件监听器易致泄漏；WeakMap/WeakRef可安全缓存对象；PerformanceMonitor与AllocationInstrumentation配合可实时监测并精确定位分配泄漏。
-
在JavaScript中查询Firebase可以通过RealtimeDatabase或Firestore实现。1.初始化Firebase应用并获取数据库引用。2.使用RealtimeDatabase时，通过ref()和on()方法查询数据；使用Firestore时，通过collection()和get()方法查询数据。3.注意实时更新、查询优化、安全规则、错误处理和性能考虑。
-
CSS选择器链越长越易出问题，因导致样式耦合高、复用差、调试难；浏览器右向匹配与人眼左向阅读冲突，加剧理解与修改风险；应改用语义化类名、BEM等模块化方案降低复杂度。
-
IE6/IE7中float元素左右margin翻倍是真实Bug，根源为hasLayout触发后margin解析错误；修复可用display:inline或改用父容器padding/非浮动wrapper。
-
Tailwind的disabled:变体需元素真实携带disabled属性才生效，JIT模式下开箱即用但依赖HTML正确渲染；若未启用插件、未同步设置disabled属性或使用非原生可禁用标签，则样式不触发。
-
localStorage持久存储且跨标签页共享，sessionStorage仅限当前标签页会话；二者均只支持字符串，存对象需JSON序列化，storage事件仅在其他同源窗口触发。
-
使用mkdir和touch命令可快速搭建HTML学习项目结构。首先在桌面创建my-html-project目录及css、js、images子目录；接着在根目录生成index.html入口文件；然后在对应子目录创建style.css和script.js；最后通过for循环批量生成page1~page3.html示例页面，完成项目初始化。
-
border-style决定边框样式，必须设置非none值边框才可见；2.border-width设置边框宽度，依赖border-style生效；3.两者需配合border-color或默认颜色共同作用，推荐使用简写border属性统一设置。
-
align-items仅作用于Flex容器的直接子元素，不穿透影响孙子元素；每层需独立设置对齐属性，align-self可覆盖父级align-items实现单个子项微调。
-
通过WebRTC和Canvas实现实时音视频特效：1.使用getUserMedia获取摄像头流并显示在video元素；2.利用Canvas逐帧绘制视频，通过getImageData操作像素实现灰度等滤镜；3.可叠加图形或贴纸（如结合face-api.js识别人脸添加猫耳朵）；4.通过canvas.captureStream输出处理后的媒体流用于推流或录制。整个流程在浏览器中完成，无需插件，基础功能依赖Canvas即可实现。
