-
AudioContext.currentTime与video.currentTime不同步因基准不同：前者基于音频硬件时钟，后者依赖渲染帧调度与解码延迟；应以video.currentTime为主时间轴，动态校准偏移并持续监控丢帧。
-
直接用::before和::after写tooltip易错位，因top/left等定位值未与方向解耦，硬编码导致改方向需手动调所有偏移；正确做法是用Lessmixin封装方向参数，通过条件分支控制transform、margin及border组合，并确保父容器设position:relative。
-
用CSSGrid实现勋章墙需设display:grid、grid-template-columns:repeat(auto-fill,minmax(120px,1fr))、gap:12px；勋章容器用flexcolumn居中内容；遮罩须挂body下并合理设置z-index；动态加载后需强制重排。
-
事件委托高效是因为将多个子元素的事件监听集中到父元素，利用冒泡机制统一处理，节省内存、提升性能，且动态增删子元素时无需重新绑定或解绑。
-
JavaScript中this绑定优先级为：new绑定最高，其次显式绑定（call/apply/bind），最后隐式绑定；new调用时this总指向新实例，显式绑定覆盖隐式绑定，隐式绑定仅在无new和显式绑定时生效。
-
history.pushState()不触发页面刷新，因它仅修改URL和历史栈而不发起新导航请求，适用于SPA无刷新路由；其state参数为可序列化对象，title参数多数浏览器忽略，url须同源；popstate仅在用户后退/前进或调用back()/forward()时触发，且需尽早绑定监听。
-
float与inline-block不能混用实现混合浮动布局，因float使元素脱离文档流并强制display为block，导致inline-block的vertical-align等特性失效，引发换行、错位、塌陷等问题。
-
用对象管理筛选状态并每次全量重算，避免class切换累加；事件委托处理多选；range防抖+URLSearchParams同步URL。
-
本文介绍如何使用现代HTML/CSS/JavaScript构建可拖拽、自动吸附到棋盘格的国际象棋界面，摒弃传统<table>布局，采用语义化<div>结构配合原生drag-and-dropAPI与坐标计算逻辑，实现流畅、可控的棋子移动体验。
-
必须加preload="auto"，因浏览器默认preload="metadata"只加载元数据，导致全屏背景视频首帧延迟渲染；需搭配muted、autoplay、loop、object-fit:cover、playsinline及正确编码格式。
-
id是唯一标识，class是复用标签；id用于锚点、label绑定和高频JS访问，class适用于样式复用、组件化开发及行为解耦，重复id会导致getElementById返回首个匹配元素且难以排查。
-
WebSockets适用于客户端与服务器间的实时文本通信，如聊天室；WebRTC用于点对点音视频通话和低延迟数据传输，需WebSocket辅助信令交换。
-
小屏通知浮窗被截断应通过媒体查询动态调整fixed定位偏移和宽度：在768px及480px断点下调小top/right值，480px下设width:calc(100vw-16px)并显式left:auto，禁用transform替代定位，键盘弹出时需JS配合处理。
-
迭代器是JavaScript中按需逐个获取序列值的统一遍历机制，可迭代对象则需实现[Symbol.iterator]方法；迭代器必须有返回{value,done}对象的next()方法，可迭代对象须通过该方法返回合法迭代器，生成器函数可简化实现。
-
统一表单控件样式需重置appearance、显式定义边框背景内边距，自绘select箭头，用CSS变量暴露主题色等可覆盖属性，配合:focus-visible与键盘测试保障可访问性。
