-
“查看网页源代码”只显示服务器返回的原始HTML，而JS动态修改的DOM需用“检查”查看Elements面板；curl默认无Cookie/User-Agent且不执行JS，故与浏览器源码不同；移动端需借助桌面DevTools调试。
-
localStorage只能存字符串，对象需用JSON.stringify序列化后存储，读取时用JSON.parse解析，且须用try...catch捕获解析错误；它会忽略函数、undefined、Symbol和Date等类型，容量约5MB并受跨域隔离限制，不可存储敏感信息。
-
负边距导致重叠内容被裁切或错乱，因容器不自动扩容且可能有overflow:hidden；需用position+z-index控制层叠，或grid-row/column精准定位共享轨道。
-
运行HTML5文件需通过浏览器打开或本地服务器环境。1、将文件保存为.html格式，双击用浏览器打开，确保路径无中文且编码为UTF-8。2、在VSCode中安装LiveServer插件，右键选择“OpenwithLiveServer”启动实时预览。3、对于需HTTP协议的功能，安装Node.js后使用npm全局安装http-server，进入文件目录执行http-server命令，通过http://localhost:8080访问页面，以支持AJAX、Fetch等特性。
-
reduce可实现对象分组与嵌套结构扁平化，flatMap能映射并展开数组，二者结合可高效处理复杂数据转换，如按作者统计评论词数。
-
clip-path是实现PPT风百叶窗切换最可控的纯CSS方案，通过inset()或polygon()动态裁剪内容区域，避免background平移或transform缩放的兼容性与性能问题。
-
BEM通过扁平化类名减少CSS重排重绘。其右向匹配高效、规避高成本选择器、支持引擎缓存；须严格遵循三段式语义分层，避免状态混入；与CSS-in-JS或Tailwind共存时需分层协作；构建工具配置错误和语义模糊才是真性能瓶颈。
-
loading="lazy"仅对<img>和<iframe>生效，需在视口外、有明确宽高且含src属性；局部滚动需IntersectionObserver；原生方案无JS依赖但兼容性受限，混用JS库会失效。
-
FormData提交失败时勿手动设置Content-Type，否则丢失boundary；混合提交注意append顺序与类型统一；fetch后response.json()报错需检查响应头及内容；IE11不支持newFormData(form)，应手动append。
-
background-image多图用逗号分隔实现叠加层，首图在最上、末图在最底，所有图均立即加载；真正懒加载需JS动态设置CSS变量或内联样式，初始不设background-image是关键前提。
-
<p>box-sizing:border-box将padding和border计入width，使设置的width等于元素总宽，避免布局错位；现代UI框架均默认启用，推荐全局重置*{box-sizing:border-box;}。</p>
-
是，flex项目默认受box-sizing直接影响；其width/height计算起点取决于box-sizing值，默认content-box会导致内容宽+padding+border溢出，推荐全局设border-box。
-
JavaScript迭代器和生成器本身是同步协议，但asyncfunction*可创建AsyncIterator，配合forawait...of实现异步遍历；需注意yield非return、done:true为终止信号、不可混用async与普通for...of。
-
虚拟滚动通过仅渲染可视区域内容，显著减少DOM数量，提升长列表性能；结合分页或懒加载降低初始负载，利用元素池化复用节点，并将计算任务移至WebWorker，避免主线程阻塞，确保流畅交互。
-
本文详解在React中实现自定义Tooltip时，如何通过动态计算焦点流、延迟聚焦和DOM遍历，使脱离文档流的tooltip内容自然嵌入页面原有tab顺序，确保键盘导航符合WCAG2.1标准。
