-
用带参数的.gradient-bg()混合函数，支持@start-color、@end-color、@direction及透明度微调，避免硬编码；多色用.gradient-bg-stops()；注意转义方向值、变量定义顺序、CSS变量分层及Safari渲染兼容性。
-
JavaScript类实例可直接解构赋值，前提是属性为实例自身可枚举属性；也可通过toObject()方法返回纯对象再解构；或实现Symbol.iterator支持数组式解构；还可结合默认值增强容错性。
-
IE完全不支持all属性和unset关键字，整条声明被静默忽略；需手动重置margin、padding、border、font-size等关键属性为IE兼容值。
-
闭包是构建跨平台适配层最轻量可靠的方式，通过在初始化阶段固化环境配置并捕获为自由变量，使函数调用无需运行时判断，支持多平台专属实例、行为封装及工厂函数动态创建。
-
open是布尔属性，只检测存在与否而非值，故open="false"仍展开；JS应直接操作el.open属性，监听toggle事件，CSS用details[open]选择器响应状态。
-
JavaScript中最推荐的单例实现是模块级单例，利用ES6模块默认导出的天然单例特性，简洁、可靠且符合语言习惯；其次为ES6Class配合静态工厂方法，避免直接new；闭包方式适用于ES5环境。
-
placeholder属性需直接写在<input>或<textarea>标签内，如<inputplaceholder="请输入邮箱">，仅作临时提示，不提交、不替代label、不支持换行与变量，且须注意可访问性与样式兼容性。
-
根本原因是默认盒模型为content-box，padding和border不包含在设置的width/height内，而是额外增加；加padding后总尺寸=内容区+2×padding。
-
PWA是一种结合网页与原生应用优势的技术，由Google提出，核心理念为渐进增强，具备可安装、离线可用、响应式设计、HTTPS安全传输和推送通知等特性；JavaScript通过ServiceWorker实现资源缓存与离线访问，利用Push与NotificationAPI实现消息推送，开发时需配置manifest.json、sw.js和服务注册逻辑，部署需HTTPS并注意缓存策略与文件路径，最终提供跨设备的流畅用户体验。
-
IE10/11必须使用display:-ms-flexbox，不识别标准display:flex；需按顺序声明：-webkit-box、-ms-flexbox、-webkit-flex、flex，漏掉或顺序错误将导致布局退化为block。
-
type="email"和type="url"仅做基础语法校验：前者接受foo@bar，后者在Chrome中接受example.com；强校验需pattern锚定（如^\d{11}$）或JS补充，required只判空不验内容，原生验证仅submit触发。
-
Cookie需手动操作document.cookie字符串，易出错；localStorage永久同源存储，sessionStorage仅限单标签页；三者均不安全，敏感信息须后端校验。
-
推荐使用EventSource（SSE）或WebSocket实现实时物流消息推送，禁用轮询；优先选EventSource（轻量、兼容好、单向），需后端支持text/event-stream；WebSocket适用于需双向通信的场景。
-
width:fill-available已被废弃，别再用了这个CSS值在Chrome57+、Firefox62+中已被移除或从未真正标准化，现在写width:fill-available或width:-webkit-fill-available属于“碰运气”行为——多数情况下不生效，或只在特定上下文（如input框内部）偶然起作用。它不是解决“填充剩余空间”的正统方案，而是历史遗留的实验性语法。用flexbox的flex:1实现可靠填充这是当前最通用、兼容性最好（
-
先保证链接可访问和页面跳转，再用JavaScript增强体验。通过原生HistoryAPI（pushState、replaceState）更新URL并监听popstate事件实现无刷新路由，拦截内链点击进行异步内容加载；结合路由表匹配路径并渲染对应视图，支持动态插入HTML或懒加载片段；服务端返回统一入口页以保障无JS时的基础可用性，实现渐进增强；附加标题管理、loading提示与hashfallback兼容旧环境，核心是分层控制：HTML负责可用，JS提升体验。
