-
JavaScript性能优化聚焦函数执行、DOM更新、内存泄漏三大瓶颈：用requestIdleCallback替代高频setTimeout/setInterval，throttle/debounce滚动监听，避免闭包持有大对象，用DocumentFragment批量DOM操作。
-
datalist标签的核心作用是为输入框提供可选的建议列表，允许用户在自由输入的同时获得预设选项的提示，提升输入效率并减少错误；它通过将input的list属性与datalist的id关联实现，无需JavaScript即可运行，适用于需要灵活性和智能提示的场景；与select标签不同，datalist不强制用户选择预设项，而select要求用户必须从固定选项中选择，适用于选项明确且不可自定义的场景；可通过JavaScript动态获取数据并生成option元素来实现根据用户输入实时更新建议列表，常配合防抖优
-
本文详解如何通过调整line-height和display属性，精准控制内联提示（tooltip）中图标（如ⓘ）的垂直对齐，根治因行内元素默认基线对齐导致的底部空白与错位问题。
-
background-clip:text非HTML5特性，需color:transparent与-webkit-background-clip:text（Chrome/Safari）配合，Firefox不支持，须用@supports回退或SVG替代。
-
传入一个整数参数时，Array构造器创建指定长度的空数组，如newArray(5)；若为负数或非整数则抛出错误；传入两个及以上参数时，无论类型均作为元素处理，如newArray(1,2)生成[1,2]；单个非数字参数则创建包含该值的数组，如newArray('a')生成['a']；由于单参数行为易引发误解，建议使用字面量语法或Array.of、Array.from等更明确的方法。
-
transition:all会降低动画性能、引发兼容性问题并增加维护成本，应仅对明确需要过渡的属性单独声明，避免在高频交互和移动端滥用。
-
value属性用于设置表单元素的初始值，语法为在标签内添加value="值"；如<inputtype="text"name="username"value="请输入用户名">；不同控件中：文本框显示默认文字，单选框和复选框定义提交值，提交按钮设按钮文字；注意密码框避免设value，textarea需将默认内容写在标签内，reset按钮会重置为初始value值。
-
WeakSet只能存储对象且不阻止垃圾回收，仅提供add()、delete()、has()方法，适用于对象身份标记等无需影响对象生命周期的场景。
-
Laravel中使用多级路径（如/alertas/historial）时，HTML页面样式和脚本丢失，根本原因是相对路径引用导致资源404；正确做法是统一使用asset()辅助函数生成绝对URL。
-
ESLint是成熟灵活的JavaScript代码检查工具，能自动化统一代码风格、降低阅读成本、减少错误并捕获潜在bug；通过三步快速接入：安装、初始化配置、集成编辑器，并需合理设置env、parserOptions、extends和rules。
-
flex:00200px锁死侧栏不伸缩且优先级高于width；中间栏需用flex:1（等价于flex-grow:1;flex-shrink:1;flex-basis:0）确保自适应，IE11需显式写三属性并加-ms-前缀。
-
使用video标签的poster属性可设置视频海报图，提升视觉体验。通过poster="图片路径"指定静态封面，建议图片与视频比例一致、大小适配、主题突出，并优化加载性能，增强用户体验。
-
HTML5<progress>的value属性修改后进度条不动，根本原因是JS修改的是property而非attribute，部分浏览器（如旧版Safari）仅响应attribute变化；应使用setAttribute('value',val)或确保先设max再设value并校验范围。
-
auto-fill保留空轨道适合hover动画，auto-fit收缩空列更省空间；minmax(200px,1fr)实现响应式列宽，需配合display:grid和合理父容器宽度；clamp()可替代minmax()第一参数实现平滑响应式，但需注意Safari兼容性。
-
localStorage持久存储，跨标签页共享；sessionStorage仅限当前标签页，会话结束即清除。两者均遵循同源策略，操作API相同，适用于不同场景：前者用于长期保存用户配置或token，后者适合临时表单数据或敏感信息。
