-
JavaScript通过document.cookie字符串接口操作Cookie：写入需拼接key=value及属性（如expires、path）；读取需split解析并解码；删除需覆盖写入过期同名Cookie。
-
使用CSSopacity与@keyframes可实现图片透明度平滑变化，如淡入淡出动画。通过设置opacity的0到1值控制透明度，结合@keyframes定义0%、50%、100%关键帧实现从透明到完全显示再消失的效果，并用animation属性将动画绑定到图片，设定持续时间、速度曲线和无限循环，最终实现高性能的视觉过渡效果。
-
CSS不生效主因是未加载或被覆盖：先查<link>路径、rel属性及disabled；再用Network面板验200状态码和Content-Type；最后在Elements面板看样式是否被划掉或作用域限制。
-
TailwindCSS通过预定义的margin、padding和space类，在HTML中直接控制布局，提升开发效率；其基于4px缩放比例的工具类可快速设置间距，如mt-4、px-6等，space-x/y用于子元素间隔，支持响应式和自定义配置，使样式管理更直观高效。
-
:focus-within是CSS伪类，当元素自身或其任意后代获得焦点时触发；它比:focus更适合搜索栏展开，因能直接作用于父容器实现点击即展开，天然支持鼠标和键盘聚焦且零JS。
-
HTML的bgcolor属性不再被推荐使用，因为其违反了“关注点分离”的原则，将样式信息混入HTML结构中，导致维护困难、扩展性差。1.bgcolor仅能设置纯色背景，缺乏CSS提供的渐变色、背景图等丰富效果；2.使用bgcolor修改样式需逐个修改HTML文件，效率低下；3.CSS通过外部样式表实现样式集中管理，提升可维护性和复用性；4.CSS选择器支持更精细的样式控制，如全局样式、特定表格、行、单元格背景色等；5.使用CSS还可结合响应式设计、可访问性标准，提升用户体验和兼容性。因此，现代前端开发推荐
-
JavaScript操作JSON需谨慎使用JSON.parse()和JSON.stringify()：前者严格校验双引号、禁止单引号/注释/尾逗号，后者会忽略undefined/function/Symbol、转NaN/Infinity为null、序列化Date为ISO字符串，且循环引用直接报错；推荐用try...catch包裹parse，用reviver/replacer定制解析与序列化逻辑。
-
Grid布局中grid-template-areas顺序写错会导致Banner和商品列表叠在一起；需确保行数匹配、区域名一致、子元素设正确grid-area，且避免空值。
-
CSS中margin所有方向的百分比均以包含块宽度为基准，而非对应方向尺寸；绝对定位元素则以最近非static祖先的宽度为准；top/bottom定位值才以包含块高度为基准。
-
父容器需设display:flex且有足够高度，再用align-items:center实现子项垂直居中、水平靠左；单子项时可用margin:auto0达成同样效果。
-
<dialog>元素必须调用showModal()或show()才能显示，其open属性为只读，手动添加仅触发初始显示但丧失模态能力；showModal()实现真正模态（禁背景交互、支持Esc/点击backdrop关闭），show()为非模态；关闭须调用close()，不可仅操作open属性；Safari15.4前不支持showModal()，需运行时检测并降级；点击backdrop关闭需手动监听dialog的click事件并判断e.target===dialog。
-
<p>默认box-sizing为content-box，width/height不含padding和border，导致元素实际尺寸变大；改用border-box可解决，并建议全局设置*{box-sizing:border-box;}。</p>
-
JavaScript创建对象无唯一正确方式，需据场景选择：字面量适合一次性对象；构造函数+new适用于多实例复用；工厂函数更灵活且避免new陷阱；Object.create()用于精细控制原型链。
-
正确实现scale+opacity动画需显式声明from状态（如scale(0.7)、opacity(0)），元素选择器中预设初始样式，配合animation:...forwards；仅定义to会导致无动画，且须避免font-size缩放、冗余will-change及IE/Safari兼容遗漏。
-
防抖应选setTimeout而非requestAnimationFrame，因其能通过clearTimeout明确取消前序任务，解决重复请求问题；本地搜索需预处理文本、建索引、避免innerHTML拼接，并为fetch传入独立AbortSignal。
