-
Handlebars适合复杂场景，支持逻辑控制与自定义helper，安全性高；模板字符串轻量简洁，原生支持，适用于简单渲染，需注意XSS防护。
-
答案：通过CSS的-webkit-background-clip:text结合linear-gradient和color:transparent，可实现文字渐变效果，需注意浏览器兼容性及属性书写顺序。
-
会改变原数组的方法有push、pop、shift、unshift、splice、reverse、sort、fill、copyWithin；其余如map、filter等均返回新数组而不修改原数组。
-
浮动布局虽被Flex/Grid取代，但在老项目、IE8+兼容及布局演进理解中仍需掌握；核心是清除浮动、脱离文档流与高度塌陷；两栏用float+margin，三栏有圣杯与双飞翼；推荐clearfix清除浮动；新项目应优先使用Flex或Grid。
-
text-align:center仅对块级容器内的行内内容有效，对块级子元素无效；居中块级元素应使用display:flex+justify-content:center。
-
HTML5结合JavaScript实现“显示更多”有三种方式：一是切换元素显隐，适用于静态内容分步展示；二是滚动触底加载，适合长列表减少首屏压力；三是IntersectionObserver懒加载，性能更优且精准检测视口进入。
-
媒体查询应写在CSS文件中更合理，避免HTML膨胀和维护困难；须配合viewportmeta标签使用width而非device-width；断点推荐移动端优先、单向min-width递增；CSS变量可在媒体查询内定义但不可用于条件判断。
-
WebWorkers是HTML5提供的API，可在后台线程运行脚本以避免阻塞主线程。通过创建Worker脚本、实例化Worker对象并使用postMessage通信，实现如耗时斐波那契计算等任务，确保页面流畅。
-
需确保协议一致、跨域处理、数据格式可解析：一、Servlet通过设置JSON响应头、序列化对象并输出；二、SpringMVC用@Controller与@ResponseBody自动转JSON；三、前端用fetch或XMLHttpRequest发起请求并解析；四、jQuery用$.ajax简化请求；五、后端配置CORS响应头或@CrossOrigin注解解决跨域。
-
虚拟列表通过只渲染可视区域内的元素来提升长列表性能。1.监听滚动事件计算可视范围；2.动态渲染可见项并用占位符维持滚动高度；3.缓存项高度以优化不同高度的渲染效率；4.配合节流、预估高度等策略提升体验，适用于万级数据流畅展示。
-
直接设font-size:14px在小屏上文字看不清，因高像素密度与窄视口导致缩成一团，且浏览器最小字号限制会强制撑大破坏排版；应采用calc(0.875rem+0.26vw)动态设置html字号，并配viewportmeta标签initial-scale=1，必要时用媒体查询分段控制。
-
Intl是JavaScript国际化的事实标准，负责日期、数字、货币、排序等本地化格式，不处理文案翻译；需显式创建实例并传入标准locale和options，避免toLocaleString()的系统依赖问题。
-
使用Flexbox实现侧边栏与主内容等高布局，只需将父容器设为display:flex，子元素会自动沿交叉轴拉伸。1.父容器设置display:flex后，子元素默认等高；2.align-items:stretch为默认行为，无需额外设置；3.确保父容器有明确高度或min-height:100vh，避免子元素设置height:100%或overflow:hidden；4.适用于后台管理、文章页等场景，结构简洁且兼容性好。
-
答案：JavaScript通过WebSpeechAPI实现语音识别与合成。使用SpeechRecognition将语音转文本，需在安全上下文并获麦克风权限；利用SpeechSynthesis将文本转语音，可设置语速、音调等参数。两者结合可用于语音助手、无障碍阅读等场景，但语音识别兼容性有限，主要支持Chrome和Edge，而合成功能普遍可用。
-
max-width仅在计算出的width大于其值时生效，如width:50%在父宽1600px时得800px才被max-width:600px截断；窄屏需配合媒体查询或min()函数。
