-
通过结合word-break属性和media查询可解决响应式布局中长单词或URL导致的换行异常。在小屏幕下使用word-break:break-all或overflow-wrap:break-word强制断行，大屏幕则恢复自然换行，确保内容不溢出容器，适用于用户输入、代码片段及flex/grid布局场景。
-
获取用户输入数值需按场景选择方法：一、getElementById+value；二、querySelector+value；三、form.elements+name/index；四、监听input事件实时获取；五、FormData批量提取。
-
字体列表顺序决定浏览器加载优先级，从左到右依次查找可用字体，未找到则回退到默认字体。包含空格或特殊字符的字体名需加引号，推荐始终添加通用字体族如sans-serif作为最终回退。通过@font-face引入的自定义字体在成功加载后会按顺序参与匹配并优先使用。合理设置字体堆栈可确保跨设备良好显示。
-
LocalStorage是浏览器提供的持久化存储方案，支持以键值对形式保存最多约5MB的字符串数据，具备页面关闭后数据不丢失、遵循同源策略、提供setItem、getItem、removeItem和clear等简单API的特点，可通过JSON.stringify和JSON.parse处理对象类型，适用于存储用户偏好、表单草稿等非敏感信息，但需防范XSS攻击、手动管理过期逻辑，并注意无痕模式下的限制。
-
JavaScript通过混入（Mixin）模式模拟多重继承，将多个对象的方法和属性复制到目标对象或原型上，实现组合式功能复用；常用Object.assign()或高阶类工厂实现，需注意方法冲突、构造逻辑缺失、this指向及私有字段限制。
-
Proxy是用于拦截并自定义对象基本操作的构造器，通过target和handler创建代理对象，支持get、set等陷阱方法，比Object.defineProperty更全面、不污染原对象且能动态拦截新增属性。
-
Set可快速去重原始值，但对象需按字段用Map或filter+findIndex；NaN自动合并，-0/+0默认等价；大数据量应避免O(n²)算法，优先用Map缓存键值。
-
Flexbox适合一维布局，如导航栏和居中对齐；Grid适用于二维复杂结构，如仪表盘；Float已过时，仅用于兼容旧项目。新项目应优先选用Flexbox和Grid。
-
JavaScript无法直接操作浏览器书签，因安全与隐私限制，仅浏览器扩展可通过chrome.bookmarksAPI访问，网页脚本只能用localStorage模拟或引导用户手动收藏。
-
HTML5HistoryAPI通过pushState添加、replaceState替换历史记录，结合popstate监听实现单页应用无刷新跳转与状态管理。
-
使用<track>标签为HTML视频添加字幕，需正确设置kind、src、srclang、label和default属性，并确保WebVTT文件格式正确、路径无误、服务器MIME类型配置恰当，同时可通过line、position等参数控制字幕样式，实现多语言支持与无障碍功能，提升用户体验。
-
overflow属性控制内容溢出时的显示方式，其取值包括visible（默认，内容溢出可见）、hidden（溢出内容被裁剪不可见）、scroll（始终显示滚动条）和auto（仅溢出时显示滚动条）；适用于卡片布局用hidden防错乱、长内容区域用auto优化体验、结合nowrap实现横向滚动；需注意在flex布局或绝对定位中可能影响裁剪效果，移动端滚动条样式差异大，必要时需自定义处理。
-
推荐使用URLSearchParams接口解析URL查询参数，它兼容主流浏览器、语法简洁且支持增删改查；旧版浏览器可手动解析location.search字符串；还可封装函数支持默认值与类型转换，或通过URL构造器解析任意URL。
-
脱离文档流的absolute元素需父容器设relative作为定位参照，否则相对视口定位易错乱；relative保留占位仅视觉偏移，适合局部调整；transform更安全用于微调与居中。
-
JavaScript无真正反射API，仅通过Object方法、Proxy、Reflect等实现有限元编程；Reflect是Object方法的函数式封装，不提供新能力；读写元信息需结合getOwnPropertyDescriptor与Proxy。
